Embed Style Sheet Rules

Welcome Xhtml Rules Agenda DocType Web Terms XHTML Elements Meta Elements Block Level Elements Lists Text Format Font Attributes Horizontal Rule Special Entities Tag Review Project I

Anchor Tag Linking Tips Insert Images Image Formats Image Attributes Image Links HexColors Web Safe Colors Project 2

Why CSS? Inline CSS Embed CSS Linked CSS CSS Attributes Font Families Font CSS Text CSS Color CSS List CSS Project 3

Div or Span Background Images Display Position Z-index Clip and Visibility Border CSS Pseudo Classes Project 4 CSS Summary

Web Resources Final Check Course Review

Embed styles use the style tag placed in the HEAD to define style rules.
Styles begin with opening tag:<style type="text/css">
Close with the </style>tag
List each xHTML tag(selector) with style rules(declarations) in {curly brackets}
Properties and values are separated by colons
Multiple properties are separated by semicolons
Classes defined using unique terms starting with a period
Id rules are similar but begin with a pound sign and used ONCE on a page

Embeded Style Sheet Format

<style type="text/css">
<- -hide from older browsers
Body {background: #ffffff; left-margin: .50in}
h1, h2 {font-family: Arial, Helvetica, san-serif; //grouped tags
font-size: 14pt;
font-weight: bold;
text-align: center;
background: #99cccc;
color: #ff00ff}
.norm {font-family: Times New Roman, serif; font-size: 11pt}
.blue {color:blue} /*identifies class*/
//- -hide from older browsers
</style>

Comments in Style Sheets and XHTML Document

Use the C programming comment: /*multiple line comments*/
single line comment //
Outside of the Style tag, use the XHTML comment <- - xhtml comment - ->

Web Design with XHTML Part I
> Doris Cuffey, Instructor