CSS: Rules, declarations, selectors, and on and on...

CSS style sheets are basically rules that say which element should look which way. So, let's pick apart style sheet to see what it is made up of.

---

This is a style sheet (which is is external and should be linked to the HTML(s)):

h1 {

    color: red;

    border-bottom: 1px solid red;

}

h2 {

    color: red;

    margin-left: 100px;

}

p {

    margin-left: 100px;

    font-size: small;

    font-family: sans serif;

}

img {

    float: right;

    margin: 0 12px;

}

---

This is a rule in that style sheet:

h1 {

    color: red;

    border-bottom: 1px solid red;

}

---

This is the selector in the rule:

h1 

---

This is the declaration block in the rule:

  {

    color: red;

    border-bottom: 1px solid red;

}

---

Whereas this is one declaration in the declaration block:

color: red;

---

This is the property in the declaration:

color

---

And this is the value for the property:

red

---

To put it all together:

selector {

    property1: value1;

    property2: value2;

}

(rule, declaration block, declarations)

That's a lot of terminology!