What is CSS?
Cascading Style Sheets (CSS) is a language for specifying how documents are presented to users.
A document is a collection of information that is structured using a markup language.
Presenting a document to a user means converting it into a usable form for your audience. Browsers, like Firefox, Chrome or Internet Explorer, are designed to present documents visually, for example, on a computer screen, projector or printer.
Examples
A web page like the one you are reading is a document.
The information that you see in a web page is usually structured using the markup language HTML (HyperText Markup Language).Dialogs in an application, also called modal windows, are often documents.
Such dialogs may also be structured using a markup language, like XUL (XML User Interface Language), which you will find in some Mozilla applications.
The information that you see in a web page is usually structured using the markup language HTML (HyperText Markup Language).Dialogs in an application, also called modal windows, are often documents.
Such dialogs may also be structured using a markup language, like XUL (XML User Interface Language), which you will find in some Mozilla applications.
Why use CSS?
Use CSS to define styles for your documents, including the design, layout and variations in display for different devices and screen sizes. You can place your CSS in the <head> of a document with an embedded style sheet, or attach a separate file that defines your styles with an external style sheet. To link an external style sheet to your document, you'll simply add a link to the style sheet in the <head> of the document.
An external style sheet has many advantages. Keeping the styles separate from your HTML content:
Helps avoid duplicationMakes maintenance easierAllows you to make a site-wide change in one place
Example
Using CSS, you store the style information in common files that all the pages share. For example, when the documents link to the same style sheet that defines the color of h2 headers, you can apply the style for h2 header tags globally by changing one css attribute.
When a user displays a web page, the user's browser loads the style information along with the content of the page.
When a user prints a web page, you can provide different style information that makes the printed page easy to read.
How do HTML and CSS work together? In general, you use HTML to describe the content of the document, not its style. You use CSS to specify the document's style, not its content. Later in this tutorial, you will see some exceptions to this arrangement.
