1. Class 5

2. Overview ofCascading Style Sheets (CSS) 2 Greater typography and page layout control Style is separate from structure Styles can be stored in a separate document and linked to from the web page Potentially smaller documents Easier site maintenance

3. CSS: Separating Structure and Design CSS in Action: http://www.csszengarden.com

4. Types of Cascading Style Sheets Inline Styles Embedded Styles External Styles Imported Styles 4

6. Use the style attribute of an XHTML tag

7. Apply only to the specific element5

8. Inline CSS Inline CSS Configured in the body of the Web page Use the style attribute of an XHTML tag Apply only to the specific element Example: configure red color text in an <h1> element: <h1 style="color:#ff0000">Heading text is red</h1> 6

9. Inline CSS Separate style rule declarations with ; <h1 style="color:#FF0000; background-color:#cccccc">This is displayed as a red heading with gray background</h1> 7

11. Use the XHTML <style> element

13. Common FormattingCSS Properties See Table 3.1 Common CSS Properties, including: background-color color font-family font-size font-style font-weight line-height margin text-align text-decoration width 10

14. CSS Embedded Styles Embedded style

15. CSS Selectors CSS style rules can be configured for an: HTML element selector class selector id selector