HTML 1 
Week 6 Review 

Using Cascading Style Sheets 
. Most professional way of "styling" web 
pages 
. A different language, not HTML 
. The ONLY way to get strict validation 
. CSS should be validated: 
http://jigsaw.w3.org/css-validator/ 

3 Ways to Apply CSS 
. Separate file (external style) 
. preferred method 
. can be attached to all pages in site 
. Style element in head of document 
(embedded style) 
. used when one page has to be different 
. much less efficient 
. Style property in individual element 
(inline style) 
. least efficient 

Syntax of CSS 
. body { background-color : gray; } 
. body - name of selector (element or class) 
. { - required punctuation 
. background-color - property 
. : - required punctuation 
. gray - value 
. ; - required punctuation 
. } - required punctuation 
. Spacing doesn't matter except for certain 
property names and values. 

Code Used to Include CSS 
. external style sheet 
. <link type="text/css" rel="stylesheet" 
href="filename.css" /> 
. goes in head of document 
. embedded style 
. <style type="text/css"> 
body {background-color: red;} 
</style> 
. also goes in head of document 
. inline style 
. <h1 style="color: blue;"> 

Classes 
. To get different styles for the same element, 
classes are used. For example: 
. p.question {color: red;} 
. p.answer {color: blue;} 
. Then an attribute is inserted into the element: 
. <p class="question"> or <p class="answer"> 
. A generic class can be used with any element: 
. .warning {color: red;} 
. <h1 class="warning"> or <strong class="warning"> 

Multiple Styles and Elements 
. body { 
background-color: silver; 
color: purple; 
font-family: Verdana, Arial, sans-serif; 
} 
. h1, h2, h3 { 
color: teal; 
} 

Beginning Properties 
. background-color: 
. color: 
. border-bottom: 
. font-family: 
. p.footer 
. .important 
silver; 
navy; 
1px dashed black; 
Verdana, Arial, sans-serif; 
class for particular element 
generic class - can be applied 
to any element