Harvard Extension School
CSCI E-12 Fundamentals of Web Site Development | Spring 2020

## CSS Selectors

- element, class, id

  -     p {/* style rules */}

  -     p.classname {/* style rules */}

  -     .classname {/* style rules */}

  -     #idname {/* style rules */}

- descendant

  -     thead th {/* style rules */}

- wildcard

  -     * {/* style rules */}

- pseudo-classes and pseudo-elements

  -     a:hover {/* style rules */}

  -     input:focus {/* style rules */}

  -     li:first-child {/* style rules */}

- attribute value

  -     input[type="submit"] {/* style rules */}

- child, sibling

  -     body > p {/* style rules */}

### CSS Comments

Note the use of comments in CSS -- they start with `/*` and end with `*/`. Comments can be on a single line or multi-line.

    p.vibrate {
      /* These paragraphs will vibrate off the page! */
      color: red;
      background-color: blue;
    }
    p.subtle {
      /* These paragraphs will
         be subtle and
         probably hard to read */
      color: white;
      background-color: gray;
    }

Copyright © David Heitmeyer