License fee: $60/student
CSS Manual (CSS101)
View Manual Online
This two-day CSS courseware first goes over the basic CSS rules and then covers each aspect of CSS with a lot of samples and hands-on exercises. It ends with a lesson on browser-compatibility issues.

Introduction to CSS Training Overview

This CSS training class teaches students to use Cascading Style Sheets to format HTML pages.

Introduction to CSS Training Course 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 about browser support for CSS
  • Learn to position elements with CSS

Introduction to CSS Training Course Prerequisites

Experience in the following areas is required.

  • HTML

Introduction to CSS Training Course Outline

  1. Crash Course in CSS
    1. Benefits of Cascading Style Sheets
    2. CSS Rules
      1. CSS Comments
    3. Selectors
      1. Type Selectors
      2. Descendant Selectors
      3. Class Selectors
      4. ID Selectors
      5. Grouping
    4. The Cascade
      1. Embedded Style Sheets
      2. External Style Sheets
      3. Inline Styles
    5. Creating an Embedded Style Sheet
    6. Creating an External Style Sheet
    7. Adding Inline Styles
    8. Media Types
    9. <div> and <span>
    10. Divs and Spans
    11. Units of Measurement
      1. Pixels (px)
      2. Points (pt)
      3. Inches (in), Centimeters (cm), and Millimeters (mm)
      4. Picas (pc)
      5. Ems (em)
      6. Exs (ex)
    12. The Inherit Value
    13. @import
  2. CSS Fonts
    1. Font - the old way
    2. Font-family
      1. Specifying by Font Name
      2. Specifying Font by Category
    3. Font-size
      1. Font-size Units
      2. Relative Font-size Terms
      3. Best Practices
    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
      1. Color Names
      2. Hexadecimal Color Values
      3. Short Hexadecimal Color Values
      4. Functional Notation
      5. Recommendation
    2. Color
    3. Background-color
    4. Background-image
      1. Background-repeat
      2. Background-attachment
      3. Background-position
    5. Colors and Backgrounds
  5. Borders, Margins and Padding
    1. Getting Started
    2. Borders
      1. Border-style
      2. Border-color
      3. Border-width
      4. Border
    3. Margin
      1. Specifying Margins by Side
    4. Padding
      1. Specifying Padding by Side
    5. Borders, Margin and Padding
  6. CSS and Links
    1. Pseudo-classes
    2. CSS Button Links
    3. Modifying Links
  7. Working with Lists
    1. List-style-type
    2. List-style-position
    3. List-style-image
    4. Working with Lists
  8. Positioning and Visibility
    1. Element Flow
    2. Position
      1. Absolute Positioning
      2. Relative Positioning
      3. Fixed Positioning
    3. Z-index
    4. Display
    5. Visibility
    6. Float
    7. Clear
    8. Positioning and Visibility
  9. Browser-compatibility Issues
    1. Quirks Mode
      1. Turning Off Quirks Mode
      2. Design Strategy
    2. Internet Explorer Conditional Statements
    3. Common Browser Bugs
      1. IE 5 and 5.5 Box Model Bug
      2. Double-Margin Bug
      3. Float-Width Bug
      4. 3-Pixel Gap Bug
    4. Fixing the Box Model Bug

Setup

For setup instructions, please visit http://www.webucator.com/Course.cfm?CourseID=CSS101

Quotes from Trainers

I have been using and teaching from Webucator's technical courseware for a while now. From a technical and pedagogical standpoint, Webucator's course materials are well organized and easy to learn from, addressing a variety of learning styles.

- M.B., Toronto, Canada

Webucator's courseware is among the easiest I've ever taught from, has very few errors, and always seems to be well received by the students.

- D.S., Park City, UT

Webucator courseware is always clear and easy to understand, full of up-to-date links to good background information, and highly interactive. It is a pleasure to use.

- K.K., Marlborough, CT

Webucator's courseware is among the most intuitive and hands-on courseware that I've taught. Explanations are clear, hands-on opportunities are frequent, and the Webucator team has been very responsive to any questions I've had. Heartily recommended!

- S.H., Atlanta, GA

Quotes from Students

Wow! So much information to digest in two days. The Training Manual will be a good resource for us in the coming months.

- S.H., Software Engineer, Sybase

The way the course was sectioned out flowed nicely. The classfiles in htdocs flowed perfectly with the manual. The material was relevant and presented in a clear manner.

- Texas Animal Health Commission

The material was very well organized. I was able to catch up on languages I wasn't as much of an expert in (XML, Javascript), and then apply that to the greater goal (Ajax).

- M.S., Interactive Programmer, Q LTD

The materials, excercises, and class were perfect for me.

- R.L., Johnson & Johnson

The learning materials were structured very well and the pace of the class was just right. Good presentation and examples.

- R.H., GIS Specialist, Southern Nevada Water Authority