CSS

February 4, 2020

Include it in the <head> of your .html file like this:

<link href="style.css" rel="stylesheet">

StackOverflow explains the difference between this and the <script src=script.js></script> we use for including your javascript file.

CSS is simply about defining a hierarchy of style rules.

Write rules like this:

element {
  attribute1: valueX;
  attribute2: valueY;
}

.class {
  attribute3: valueZ;
}

#id {
  attribute4: valueW;
}

Remember, colons (:) not equal signs (=). And end each rule with a semi-colon.

You can define variables to save eg. entering colors (note the American spelling!) multiple times:

:root {
  --bg-color: #ee0044;
  --variable-name: VALUE;
}

body {
  background-color: var(--bg-color)
}

Here is Google’s HTML/CSS style guide.

New rules on new lines. Two space indent.