CSS

CSS

• html

Frameworks

• https://picocss.com/
• bulma
• bootstrap
• Kitchen Sink Demo

Dark Mode

• CSS Tricks

@media (prefers-color-scheme: dark) {
  /* Dark theme styles go here */
}


@media (prefers-color-scheme: light) {
  /* Light theme styles go here */
}

Custom Properties

MDN

Nesting

MDN

Nesting Selector &

/* Without nesting selector */
.parent {
  /* parent styles */
  .child {
    /* child of parent styles */
  }
}

/* With nesting selector */
.parent {
  /* parent styles */
  & .child {
    /* child of parent styles */
  }
}

/* the browser will parse both of these as */
.parent {
  /* parent styles */
}
.parent .child {
  /* child of parent styles */
}