Cascading Style Sheets

Cascading Style Sheets, or CSS, are a way to change the look of HTML and XHTML web pages. CSS was designed by the W3C, and is supported well by most modern web browsers. The current version of CSS is CSS3. CSS4 is available, but is split into parts.

One advantage to using CSS is a web page can still be displayed and understood, even if the CSS is not working or removed.

CSS code is saved in files with the .css file extension.

CSS Examples

Paragraphs

To make all paragraphs on a page blue and sized 20% bigger than normal text, we would apply this CSS rule to a page:

p {
  color: blue;
  font-size: 120%;
}

The p refers to all HTML elements with the <p> tag. The CSS is being used to change this element. The color and font-size are both properties and the blue and 120% are values. Each property has a set of possible values. These values can be words or numbers.

Main Title

To give the the main Title on a page a solid red border underneath, we would apply this CSS rule to the page. 5px otherwise known as pixels, represents the thickness of the line:

h1 {
    border-bottom: 5px solid red;
}

The H1 refers to all HTML elements with the <H1> tag. The CSS is being used to change this element. The border-bottom is the property and the 5px and solid red are values. Each property has a set of possible values. These values can be words or numbers.

Other websites

• W3C
• Website about CSS3
• HTML Source: Beginner's CSS Tutorials - a site of tutorials aimed at web design beginners.