FREE K-12 AI LITERACY COURSES FOR THE 26-27 SY! Learn more here.

Courses for every classroom

HTML 2 + CSS 2

Dives deeper into HTML and CSS, allowing students to further customize their websites.

Semester course · 25 lessons · 1 unit

  • HTML
  • CSS
  • Voyage
  • Semester
  • 6th grade
  • 7th grade
  • 8th grade
  • 9th grade
  • 10th grade
  • 11th grade
  • 12th grade

Recommended prerequisite: HTML 1

Course Summary

This course dives deeper into web development as students discover more of what HTML and CSS can do. Students explore the possibilities of bootstrap, animations, and tables among other topics. Students polish their websites further, adding sophistication and interaction to their sites. Students will need to have completed HTML 1 and CSS 1 to understand HTML 2 & CSS 2.

Course Outline

    1. External Style Sheet External style sheets allow us to clean up our HTML files and manage all of our CSS in a separate location. Let's clean up that code!
    2. Bootstrap Intro This lesson covers the basics of adding bootstrap to your website and its usefulness.
    3. Bootstrap Classes This lesson covers Bootstrap classes, specifically the container and container-fluid classes.
    4. Bootstrap Grid Bootstrap grid defines the basic layout of your website. This lesson will cover how to use it.
    5. Twelve Column Grid The twelve column grid is how bootstrap allows you to define widths of your elements.
    6. Grid Review This is the grid checkpoint. Good luck!
    7. Bootstrap Jumbotron Similar to a sport arena jumbotron, Bootstrap jumbotrons create a large block to catch your users attention.
    8. Bootstrap Cards Cards are an excellent way to arrange content in small sections on your website.
    9. Bootstrap Carousels Similar to how a theme park carousel rotates in a circle, Bootstrap carousels allow you to rotate through images.
    10. Bootstrap Nav Bar Nav bars allow the user to navigate between the pages or sections of your website. This lesson gives a great overview of how to use them.
    11. Bootstrap Dropdown Learn how to add dropdown menus with Bootstrap.
    12. Components Review This is the Bootstrap component checkpoint. Review the past Bootstrap lessons and you should do great!
    13. Transform Similar to the CSS Animations lesson, we can also use transform to transition smoothly between two styles.
    14. Transition The transition property allows us to change the way transformations look while the element is transforming.
    15. Transitions Review This is the transitions checkpoint! You got this.
    16. Animations This lesson covers the basics of creating great looking animations using only CSS! The possibilities are endless.
    17. Tables Intro This lesson introduces tables and how they can be used to display data.
    18. Tables Continued This lesson continues the topic of HTML tables and dives deeper into building tables to display data.
    19. Table Styles Tables are great but we want them to look great as well. Let's add some styles!
    20. Table Review This is the table checkpoint. Good luck!
    21. Forms Forms allow users to input data that can be processed and stored. This lesson covers how to implement a form on your site.
    22. Text Input Text inputs are an essential part of forms. Let's collect some input!
    23. Radio Input Radio inputs are another type of input that allows the user to select an option from a list.
    24. Form Review This is the Form Checkpoint. You got this!
    25. APIs

Standard Alignment

State standards documents

Document Standards Grades
National
2022 Skill Struck Standards Alignment + Correlation Guide CSTA K-12 Computer Science Standards · 2022 K-2, 3-5, 6-8, 9-12
Alabama
Alabama Course of Study Digital Literacy and CS Standards + Skill Struck Alignment Alabama Course of Study Digital Literacy and CS Standards K-2, 3-5, 6-8, 9-12
Arizona
Arizona Computer Science Standards + Skill Struck Alignment Arizona Computer Science Standards K-2, 3-5, 6-8, 9-12
Arkansas
Arkansas Computer Science and Computing Standards High School Programming + Skill Struck Alignment Arkansas Computer Science and Computing Standards High School Programming · 2023 9-12
Arkansas Computer Science and Computing Standards Middle School Introduction to Coding Standards + Skill Struck Alignment Arkansas Computer Science and Computing Standards Middle School Introduction to Coding Standards · 2023 6-8
California
California K-12 CS Standards + Skill Struck Alignment California K-12 CS Standards K-2, 3-5, 6-8, 9-12
Georgia
Georgia Standards of Excellence for K-8 Computer Science + Skill Struck Alignment Georgia Standards of Excellence for K-8 Computer Science K-2, 3-5, 6-8
Idaho
Idaho Content Standards Computer Science + Skill Struck Alignment Idaho Content Standards Computer Science · 2023 K-2, 3-5, 6-8, 9-12
Illinois
Illinois Computer Science Standards + Skill Struck Alignment Illinois Computer Science Standards · 2022 K-2, 3-5, 6-8, 9-12
Indiana
Indiana K-12 Computer Science Standards + Skill Struck Alignment Indiana K-12 Computer Science Standards · 2023 K-2, 3-5, 6-8, 9-12
Iowa
Iowa Computer Science Standards + Skill Struck Alignment Iowa Computer Science Standards K-2, 3-5, 6-8, 9-12
Kansas
Kansas CS Standards P-12 + Skill Struck Alignment Kansas CS Standards P-12 · 2023 K-2, 3-5, 6-8, 9-12
Kentucky
Kentucky Academic Standards for Computer Science + Skill Struck Alignment Kentucky Academic Standards for Computer Science · 2023 K-2, 3-5, 6-8, 9-12
Maryland
Maryland K-12 CS Standards + Skill Struck Alignment Maryland K-12 CS Standards · 2023 K-2, 3-5, 6-8, 9-12
Massachusetts
Massachusetts Digital Literacy and Computer Science Standards + Skill Struck Alignment Massachusetts Digital Literacy and Computer Science Standards · 2023 K-2, 3-5, 6-8, 9-12
Michigan
Michigan K-12 Standards Computer Science + Skill Struck Alignment Michigan K-12 Standards Computer Science · 2023 K-2, 3-5, 6-8, 9-12
Mississippi
Mississippi College and Career Readiness standards for Computer Science + Skill Struck Alignment Mississippi College and Career Readiness standards for Computer Science · 2022 K-2, 3-5, 6-8, 9-12
Missouri
Missouri K-12 Computer Science Performance Standards + Skill Struck Alignment Missouri K-12 Computer Science Performance Standards · 2023 K-2, 3-5, 6-8, 9-12
Nebraska
Nebraska K-12 Technology Standards + Skill Struck Alignment Nebraska K-12 Technology Standards · 2023 K-2, 3-5, 6-8, 9-12
Nevada
Nevada Academic Content Standards for CS + Skill Struck Alignment Nevada Academic Content Standards for CS K-2, 3-5, 6-8, 9-12
Nevada Academic Content Standards for Integrated Technology + Skill Struck Alignment Nevada Academic Content Standards for Integrated Technology K-2, 3-5, 6-8, 9-12
Nevada Computer Science Standards + Skill Struck Alignment Nevada Computer Science Standards 9-12
New Jersey
New Jersey Computer Science and Design Thinking Standards + Skill Struck Alignment New Jersey Computer Science and Design Thinking Standards · 2020 K-2, 3-5, 6-8, 9-12
New York
New York Computer Science and Digital Fluency Learning Standards K-12 + Skill Struck Alignment New York Computer Science and Digital Fluency Learning Standards K-12 K-2, 3-5, 6-8, 9-12
North Carolina
North Carolina K-12 CS Standards + Skill Struck Alignment North Carolina K-12 CS Standards K-2, 3-5, 6-8, 9-12
Ohio
Ohio's Learning Standards Computer Science + Skill Struck Alignment Ohio's Learning Standards Computer Science · 2023 K-2, 3-5, 6-8, 9-12
Oklahoma
Oklahoma Academic Standards for Computer Science + Skill Struck Alignment Oklahoma Academic Standards for Computer Science K-2, 3-5, 6-8, 9-12
Rhode Island
Rhode Island's K-12 CS Education Standards + Skill Struck Alignment Rhode Island's K-12 CS Education Standards K-2, 3-5, 6-8, 9-12
South Carolina
South Carolina Computer Science and Digital Literacy Standards + Skill Struck Alignment South Carolina Computer Science and Digital Literacy Standards · 2023 K-2, 3-5, 6-8
South Carolina's Computer Science Standards for High School + Skill Struck Alignment South Carolina's Computer Science Standards for High School · 2023 9-12
Tennessee
Tennessee K-12 Computer Science State Standards + Skill Struck Alignment Tennessee K-12 Computer Science State Standards · 2023 K-2, 3-5, 6-8, 9-12
Texas
TEKs Skills for CTE + Skill Struck Alignment TEKs Skills for CTE 9-12
TEKs Technology Applications K-8 Standards + Skill Struck Alignment TEKs Technology Applications K-8 Standards K-2, 3-5, 6-8
Utah
Utah 6-12 CS Standards + Skill Struck Alignment Utah 6-12 CS Standards · 2019 6-8, 9-12
Virginia
Virginia K-12 CS Standards + Skill Struck Alignment Virginia K-12 CS Standards · 2023 K-2, 3-5, 6-8, 9-12
Washington
Washington K-12 CS State Learning Standards + Skill Struck Alignment Washington K-12 CS State Learning Standards K-2, 3-5, 6-8, 9-12
Wisconsin
Wisconsin Standards for Computer Science + Skill Struck Alignment Wisconsin Standards for Computer Science · 2023 K-2, 3-5, 6-8, 9-12
Wyoming
Wyoming Computer Science Content Standards + Skill Struck Alignment Wyoming Computer Science Content Standards · 2020 K-2, 3-5, 6-8

Course Project

In this course, students will complete challenges that help solidify concepts as they use skills in a variety of ways. In order to complete tasks, students will creatively apply what they've learned by using different approaches to reach a goal. This experience closely follows challenges they would face in a technical interview, allowing them to practice. Students will create a variety of more advanced websites using different web development skills.

  • HTML 2 & CSS 2 student project: Sunset
    Sunset
  • HTML 2 & CSS 2 student project: NASA
    NASA
  • HTML 2 & CSS 2 student project: Shoe Size Playing with Borders
    Shoe Size Playing with Borders
  • HTML 2 & CSS 2 student project: Column Chart
    Column Chart
  • HTML 2 & CSS 2 student project: Forms
    Forms