So far we have covered the HTML required to markup a page. HTML wraps around the content of the page, telling the content what it is (a paragraph, heading, etc). For appearance, we turn to CSS.
| HTML | CSS |
|---|---|
| content | appearance |
| “what something is” | “how something looks” |
| semantic markup of data | rules for appearance of content |
The CSS acronym is best explained in the following order:
- Styles
- Rules governing the appearance of web page content.
- Sheets
- The rules are predominantly in a document, or several documents, separate from the HTML: a separate “sheet”.
- Cascading
- These rules can have various priorities, meaning that the appearance of the page can adjust to various circumstances (for example, different rules might cover the appearance of a web page when it is printed versus when it is displayed on the screen). The rules can also be overlapping, syncretic or conflicting: if more than one rule commands the appearance of an element, CSS sorts out which style rule takes priority.
CSS has several advantages over alternative methods of determining the appearance of web pages:
- It separates appearance from content, meaning that one can be changed without having to adjust or untangle the other.
- The ability to very quickly change the overall look of a site, or to optimize the appearance of the site for mobile devices, or users with accessibility needs).
- CSS rules assure consistency of appearance across pages of a web site.
- They add powerful techniques in dealing with advanced features of HTML, such as
<div>.
Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.
