Cascading Style Sheets Reference

CSS Terminology

Types of CSS Styles

  1. Inline: Place as an attribute in an opening tag (not a closing tag). Example:

    <h1 style="font-size: 200%; font-style: italic;">
    Chapter 1

  2. Internal style: Also called document-level. Place between <style> and </style> in the head of the document. Example:

    <style type="text/css">
    h1  {font-size: 200%; font-style: italic;}

  3. External style: Also called linked. Create a separate .css file containing the style declarations. Include the following tag in the head of the document to link to the .css file:

    <link rel=stylesheet type="text/css" href="stylesheet.css">


Type Unit Example
Absolute Inch 0.5in
Absolute Centimeter 1.2cm
Absolute Millimeter 8mm
Absolute Point 12pt
Pixels Pixel 25px
Percentage Percent 150%
Relative Em 2em
Relative Ex 1.3ex

Categories of Values


Colors can be specified by using one of these standard color names:
aqua  black  blue  fuchsia  gray  green  lime  maroon 
navy  olive  purple  red  silver  teal  yellow  white

Colors can also be specified by using a hex color code such as #F0A431.  

Here is a complete list of Extended HTML Colors and their hex color codes.


A URL for a background image is specified as:  url(images/marble.jpg)
An URL can also contain an absolute address:  url(  


Property Values
background-attachment scroll  fixed
background-color * A color
background-image * A URL
background-repeat * repeat  repeat-x  repeat-y  no-repeat


Property Values
font-family * Any font that resides on the browser's computer.
font-size * A length
font-style * normal  italic
font-weight * normal   bold
color * A color

Table Styles

Property Values
border-style solid   double   dotted   dashed
border-color Any color
border-width Any length
border * See lecture notes


Property Values
letter-spacing A length
line-height A length
text-align * left  center  right  justify
text-decoration none  underline  overline  line-through
text-indent A length (positive or negative)
vertical-align baseline  middle  sub  super  text-top
text-bottom  top  bottom
word-spacing A length

* You should know these tags for the midterm and final exams. You should also know the following.

List Styles

Values for the list-style-type property:

circle  disc  numeric  upper-alpha  lower-alpha  upper-roman  lower-roman  none


There are four states that a hyperlink can be in: link (not selected and not visited), active (currently selected and being processed by the browser), visited (already visited by the user), and hover (the mouse has moved over the link). These states are represented by the elements a:link, a:active, a:visited, and a:hover respectively.


a:link    { color: blue; }
a:active  { color: red; font-weight: bold }
a:visited { color: green; }
a:hover   { color: white; background-color: red; }


A class is a shortcut for using a predefined inline style.

Web reference

All of the properties and values are listed at W3C Schools CSS Reference.

To Documents