In this lesson, we dig a little deeper into how CSS works and what we can do with the language.

• Web Design Syllabus

Teacher Activities

• Check Learning Journals
• Pre-teach vocab (Selector / Inheritance / Attribute / Pseudo)
• Discuss the problem of conflicting CSS rules

Student Activities

• Participate in class discussion
• Read Cascade and inheritance and take outline notes
• Open your summer narrative in VS Code
  1. Add a conflicting / overriding CSS rule.
  2. Write a comment explaining which rule will be applied and why
  3. Show me your code!*
• Read CSS selectors and take outline notes
• In your notes, list and define the following CSS Selector terms (include a syntax example):
  • Type, class, and ID selectors
  • Attribute selectors
  • Pseudo-classes and pseudo-elements
  • Combinators

Extend

Practice CSS selectors with the CSS Diner Game