Accordians

Feel free to look up the referenced CSS selectors & properties at MDN (the link is on the right side of this page).

Selectors

To create an accordian, you’ll need to view this presentation & look for the following selectors:

  • ::before
  • :checked
  • :last-of-type
  • ~ combinator

CSS Building Blocks: Selectors

Properties

To create an accordian, you’ll need to view this presentation & look for the following CSS properties:

  • content
  • cursor (I don’t cover this in any presentation, so look it up)
  • list-style
  • transform: rotate

CSS Building Blocks: Selectors

Find content in the section on ::before & ::after:

Tables & Lists: Organized Data

Find list-style in the section on Lists:

Decorating with CSS: Cool Ways to Make Things Pretty

Find transform: rotate in the section on transform (it’s in the example code):

WebSanity Top Secret