CSS

Coding standards

Most projects have coding standards. They make code look the same in every file, making it predictable, and easy to read.

We'll use some basic coding standards for HTML, CSS, and JS.

HTML

Indenting

A standard we'll follow is indentation by four spaces. When a tag is inside another tag, use indenting to make containership clear. For example:

<div id="output-container" class="hide-on-load">
    <p>I have a bracelet. It says:</p>
    <p>What would <span id="character">Scooby Doo</span>?</p>

Interaction

The story do far

Responding to hover

All the CSS we've done is static. Nothing the user does changes the way it looks, apart from resizing the browser.

CSS can respond to some user actions. We'll only talk about one of them: hover. When the user puts the mouse cursor on an HTML element, you can change the way it looks.

Here's some code we've seen before, with one addition:

bc.

Keywords: 

Fan site

Make a fan site about a movie, book, TV show, band, person, whatever you like.

(If you were logged in as a student, you could submit an exercise solution, and get some feedback.)