So far, we have been using HTML only to encode semantic information, as it is intended. We have used the tags to indicate what is a paragraph (<p>), or heading (<h1>, <h2>, <h3>), or list (<ul> and <ol> with <h1>). We haven't had any way to indicate what a ”level-1 heading“ should look like. Obviously to create nice web pages, we will need some way to do this.
The CSS (Cascading Style Sheets) language will give us a way to express information about the appearance of different parts of our content. CSS information (style sheets) will also be edited with a text editor, and saved in .css files.
Why Separate Style Information?
As we discussed in the semantic markup topic, separating content in HTML files and style in CSS files may seem like extra work when starting out.
CSS will allow us to give all of our site's appearance information in one place: even if we have hundreds of HTML files, they an all refer to one CSS file. That way, if we want to make a change in the appearance of a site, it requires only a single change. We can also have separate people working on different parts of the site (authors creating HTML and designers creating CSS).