CSS 101

What is CSS?

CSS stands for "cascading stylesheets." Stylesheets use rules to set things like colors and sizes and applies them to elements associated with a given selector. They're called "cascading" because rules that appear later on will overwrite rules applied earlier.

Vocabulary

CSS rules are defined in the stylesheets and are used by the browser to determine how to present the HTML document.
Selectors describe what elements the rule will be applied to.
Properties like color and size are inside the rule.

Additional resources

What is CSS? from Mozilla's web docs

Anatomy of a CSS Rule

Unlike HTML files, Neocities does not give you any initial CSS to investigate, but that's because CSS rules are simple and you add them as you go. They're not as structured as HTML.

Selectors

element selectors grab anything that is that element. you use the name for the selector and that's it. for this example rule, divs will have red text.
```
div { 
  color: red; 
}
```
class selectors grab anything that has that class, even if those things are different types of elements. to select a class, you put a . in front of the name of the class. in the example below, text inside an element with the class "red" will have red text.
```
.red { 
  color: red; 
}
```
id selectors grab the item with that id. because ids can only be used once per document, they are very specific. to select an id, you put a # in front of the id. in the example below, text inside the element with id="red-text-header" will be red.
```
#red-text-header { 
  color: red; 
}
```
id selectors grab the item with that id. because ids can only be used once per document, they are very specific. to select an id, you put a # in front of the id. in the example below, text inside the element with id="red-text-header" will be red.
```
#red-text-header { 
  color: red; 
}
```

Properties

display
- block
- inline
- flex