COMP 20: Web Programming

Cascading Style Sheet (CSS)

Why CSS?

Box Model

Syntax

id selector vs class selector

Inserting and Using CSS

1. As external file; declare in <head> section (preferred)

<link rel="stylesheet" href="default_style.css" />

2. Internally in <head> section (meh!)

<style>
        ...
        ...
        ...
</style>

3. Inline within an element (yuck!)

<p style="...">Whoa there!</p>

NOTE: The attribute-value pair type="text/css" for <link> and <style> is no longer required. See http://stackoverflow.com/questions/5409114/is-type-text-css-necessary-in-a-link-tag.

The "Cascading" in Cascading Style Sheets

Advanced Compositions

Pseudo-Classes

Units of Measurements

Colors