CSS: Cascading Style Sheets

Why Does CSS Exist?

• HTML is used to structure content.
• CSS is used for formatting structured content.

Basic CSS Syntax

• General structure: selector {property : value; }
• Concrete example: body {background-color : #FF0000; }

Using Internal Stylesheets - style attribute

• <p style="background-color: #FF0000;>

Using External Stylesheets - preferred over internal

• Create filename.css with stylesheet information.
• Place <link rel="stylesheet" type="text/css" href="filename.css" /> in the head section of an html document.

Colors and Backgrounds

• property: color
• property: background-color
• property: background-image, value: url("fill in");
• property: background-repeat, values: repeat-x, repeat-y, repeat, no-repeat
• property: background-attachment, values: scroll, fixed
• property: background-position
  • values: 2cm 2cm
  • values: 30% 30%
  • values: left/center/right top/center/bottom
  • values: 30px 40px

Validation

• Just like html, css files can also be validated. Here is the CSS Validation Service.

CSS Reference

• The W3C reference