Comprehensive CSS Training Courseware

Length: 4 days

Webucator's Comprehensive CSS Training Courseware provides a complete solution for deliverying Private or Public Technical Training.

---

---

Comprehensive CSS Training Courseware

Courseware Overview

This CSS training class teaches students to use Cascading Style Sheets to format HTML pages. After learning the basics of CSS, students will learn to use CSS to format forms, create list-based navigation, do advanced page layouts, and create stunning background effects. Students will also learn about CSS coding conventions and shorthand properties.

Courseware Goals

• Learn the benefits of CSS.
• Learn to avoid using deprecated tags and attributes.
• Learn CSS syntax.
• Learn to use <div> and <span> tags appropriately.
• Learn most of the common properties and their values.
• Learn to create custom CSS cursors.
• Learn to style links with CSS to create "CSS Buttons".
• Learn to work with borders, margin, and padding (the box model).
• Learn to style tables with CSS.
• Learn to position elements with CSS.
• Learn advanced CSS page layout techniques.
• Learn how to use shorthand CSS properties.
• Learn to create cool effects with background images using CSS.
• Learn to lay out forms without tables.
• Learn to use CSS with lists to create hierarchical navigation.
• Learn to organize your CSS code.
• Learn about browser support for CSS.

Courseware Outline

1. Crash Course in CSS
   1. Benefits of Cascading Style Sheets
   2. CSS Rules
   3. Selectors
   4. Precedence of Selectors
   5. The Cascade
   6. Creating an Embedded Style Sheet
   7. Creating an External Style Sheet
   8. Adding Inline Styles
   9. Media Types
   10. <div> and <span>
   11. Divs and Spans
   12. Units of Measurement
   13. The Inherit Value
   14. @import
2. CSS Fonts
   1. Font - the old way
   2. Font-family
   3. Font-size
   4. Font Family and Font Size
   5. Font-style
   6. Font-variant
   7. Font-weight
   8. Font Style, Font Variant and Font Weight
3. CSS Text
   1. Letter-spacing
   2. Word-spacing
   3. Line-height
   4. Text-align
   5. Text-decoration
   6. Text-indent
   7. Text-transform
   8. Vertical-align
   9. White-space
   10. Text Properties
4. Colors and Backgrounds
   1. About Color Values
   2. Color
   3. Background-color
   4. Background-image
   5. Colors and Backgrounds
5. Custom Cursors
   1. Cursor Styles
   2. Custom Cursors
   3. Using Custom Cursors
6. CSS and Links
   1. Pseudo-classes
   2. CSS Button Links
   3. Modifying Links
7. Borders, Margins and Padding
   1. Getting Started
   2. Borders
   3. Margin
   4. Padding
   5. Borders, Margin and Padding
8. Styling Tables with CSS
   1. A Review of HTML Table Syntax
   2. Styling a table
9. Positioning and Visibility
   1. Element Flow
   2. Position
   3. Positioning
   4. Z-index
   5. Display
   6. Visibility
   7. Float
   8. Clear
10. Advanced CSS Page Layout
    1. Resetting Styles
    2. Full Width Layouts
       1. Two-column
       2. Three-column
    3. Positioning the Headings
    4. Fixed Width Layouts
       1. Two-column
       2. Three-column
    5. A Recommendation on Positioning
       1. Other Methods of Layout
    6. Laying out a Page - The power of float
11. CSS Shorthand Properties
    1. What is CSS Shorthand?
       1. List of CSS Shorthand
    2. Shorthand Margins and Padding
    3. Shorthand Border and Outline
    4. Shorthand Backgrounds
    5. Shorthand Fonts
    6. Shorthand Lists
    7. Using Shorthand
12. CSS Lists as Hierarchical Navigation
    1. Using Lists as Vertical Navigation
    2. Using Nested Lists as Navigation
    3. Using Lists as Horizontal Navigation
    4. Using Lists as Drop-Down or Fly-Out Navigation
    5. Using a List to Create a Navigation Menu
13. CSS Background Tricks
    1. The State of Rounded Corner Boxes
    2. Fixed-width Rounded Corner Boxes
    3. Relative-width Rounded Corner Boxes
    4. "Mountaintop" Corner Boxes
    5. Tabbed Navigation
    6. Drop Shadows
    7. Replacing Text with an Image
    8. Using Backgrounds
14. Laying out and Styling Forms with CSS
    1. Laying out the Questions
    2. Creating the Form
    3. Reset Revisited
    4. Styling the Form
    5. Expanding the Form
15. CSS Best Practices
    1. Review some of recommended CSS Best practices
16. Browser-compatibility Issues
    1. Quirks Mode
    2. Internet Explorer Conditional Statements
    3. Common Browser Bugs / Issues
    4. Fixing the Box Model Bug

Courseware Materials

• A printed manual with an optional custom cover.
• A zip file containing the class files to be distributed to the students.
• A zip file containing the class files and a PDF copy of the manual for the instructor to present.

Class Prerequisites

Experience in the following areas is required:

• HTML

Technical Requirements

Our computer technical requirements and setup process is easy, with support just a click away.

• Course technical requirements and setup instructions.