1. INTRODUCING CSS What CSS does How CSS works Rules, properties, and values

2. HOW TOMAKE YOUR WEB PAGES MORE ATTRACTIVE, CONTROLLING THE DESIGN OF THEM USING CSS.  Introduce you to how CSS works  Teach you how to write CSS rules  Show you how CSS rules apply to HTML pages

3. UNDERSTANDING CSS  Imagine that there is an invisible box around every HTML element  BLOCK & INLINE ELEMENTS  CSS allows you to create rules that control the way that each individual box (and the contents wdof that box) is presented

4. EXAMPLES

5. CSS ASSOCIATES STYLE RULES WITH HTML ELEMENTS  A CSS rule contains two parts: a selector and a declaration

6. CSS PROPERTIES AFFECT HOW ELEMENTS ARE DISPLAYED  CSS declarations sit inside curly brackets and each is made up of two parts: a property and a value, separated by a colon. You can specify several properties in one declaration, each separated by a semi-colon

7. EXAMPLE  This example uses two documents: the HTML file (example.html) and a separate CSS file (example.css). The fifth line of HTML uses the element to indicate where the CSS file is located.

8. USING EXTERNAL CSS  Results

9. USING INTERNAL CSS

10. CSS SELECTORS  chapter-10/css-selectors.html Universal Selector  Type Selector  Class Selector  ID Selector  Child SelectorDescendant Selector  Adjacent Sibling Selector  General Sibling Selector

11. HOW CSS RULES CASCADE  chapter-10/cascade.html

12. INHERITANCE  chapter-10/inheritance.html

13. EXTERNAL STYLE SHEETS  several advantages  Sometimes you might consider placing CSS rules

14. DIFFERENT VERSIONS OF CSS & BROWSER QUIRKS  CSS will tell you that some browsers display a few of the CSS properties in an unexpected way  When you look at your site in more than one browser, you might find that some elements on your page do not look as you expect them to

15. SUMMARY  CSS treats each HTML e XX lement as if it appears inside its own box  Rules are made up of selectors and declarations  Different types of selectors allow you to target your rules at different elements.  Declarations are made up of two parts  CSS rules usually appear in a separate document, although they may appear within an HTML page.

16. CSS COLOR  How to specify colors  Color terminology and contrast  Background color

17. FOREGROUND COLOR  chapter-11/foreground-color.html

18. BACKGROUND COLOR  chapter-11/background-color.html

19. UNDERSTANDING COLOR

20.  RGB Values  Hex Codes  Color Names  Hue  Saturation  Brightness

21. CONTRAST  Low, Medium. High

22. CSS 3: OPACITY  chapter-11/opacity.html

23. CSS 3: HSL COLORS  Hue, saturation, lightness

24. CSS 3: HSL &HSLA  chapter-11/hsla.html

25. SUMMARY COLOR  Color not only brings your site to life, but also helps convey the mood and evokes reactions  There are three ways to specify colors in CSS: RGB values, hex codes, and color names.  Color pickers can help you find the color you want.  It is important to ensure that there is enough contrast between any text and the background color  CSS3 has introduced an extra value for RGB colors to indicate opacity. It is known as RGBA  CSS3 also allows you to specify colors as HSL values, with an optional opacity value. It is known as HSLA.