CSS Class: Index

Read Me!

iWhat is CSS and Why Should I Care?
iiAbout This Course
iiiCourse Conventions
ivFluid Design and Media Types — minor corrections 8/16/04
1How CSS Works
2The Anatomy of a Rule
3Communicating Styles to the Browser — revised with new material 8/16/04
4Sample Page
4hSample Page via HTML Only
5Code for Sample Page
5hCode for Sample Page via HTML Only
6Examining the CSS Code of the Ugly Page
7Prep for Worksheet #1: Peanut Butter Sandwiches
8Instructions for Worksheet #1
9Worksheet #1: Making a Peanut Butter and Jelly Sandwich
10Grouping Selectors
11 Instructions for Worksheet #2
12Worksheet #2: Making a Peanut Butter and Jelly Sandwich, Part 2
13Doctype and Character Set Code — minor corrections 8/16/04
14Display Types // The <div> and <span> Tags
15Class Selectors
15aMore on Class Selectors — new 8/16/04
16Naming Your Classes // Organizing Your Style Info
17Enclosing Embedded Stylesheets in an <!-- HTML Comment--> //
Instructions for Worksheet <#3 — minor corrections 8/16/04
18Worksheet #3 — Alice the First
19Using Multiple Classes to Style an Element
20Instructions for Worksheet #4
21Worksheet #4 — Alice the Second
22Combining Element and Class Selectors — revised 8/16/04
23Instructions for Worksheet #5 — minor corrections 8/16/04
24Worksheet #5 — Alice the Third
25ID Selectors— minor corrections 8/16/04
26Document Structure: The Tree: Descendant Selectors — minor corrections 8/16/04
27The Containment Hierarchy & Inheritance
28Specificity
29The "Cascade"
30CSS Comments // Instructions for Worksheet #6
31Worksheet #6: Making a Peanut Butter and Jelly Sandwich, Part 3
32Using Descendant Selectors With Element.Class Selectors — minor corrections 8/16/04
33Instructions For Worksheet #7
34Worksheet #7 — Alice the Fourth
35The Box Model
36Units of Measure
37Centering Block-Level Elements
38Playing With Boxes
39Expanding the "Properties" Horizon — Part 1: Shorthand Properties for Margins and Padding
40Instructions for Worksheet #8
41Worksheet #8 — Attack of the Smileys
42Expanding the "Properties" Horizon – Part 2: Borders
43Summary of border Properties and Values
44Instructions for Worksheet #9 — revised 8/16/04
45Worksheet #9 — Making a Peanut Butter and Jelly Sandwich, Part 4
46Instructions for Worksheet #10
47Worksheet #10 — A Nutty History of Peanut Butter. A Review, Part 1
48Instructions for Worksheet #11
49Worksheet #11 — A Nutty History of Peanut Butter. A Review, Part 2
50Pseudo–Class Selectors – Part 1: Why?
51Pseudo–Class Selectors – Part 2: How? — minor corrections 8/16/04
52Pseudo–Class Selectors – Part 3: The "Order" Matters
53Pseudo-Class Selector Examples
54Instructions for Worksheet #12
55Worksheet #12
56External Stylesheets
57External Stylesheets — Unstyled Demo
58External Stylesheets Demo
59Validating Your HTML Markup
60Validating Your CSS Code
61Styling Fonts: Part #1
62Styling Fonts: Part #2
63Styling Fonts: Part 3 // Font Property Summary
64Styling Text: Part 1
65Styling Text: Summary // Optional Worksheet
66{Unintentionally Blank}
67CSS Positioning: Preview
68CSS Positioning: An Overview
69The float Property
70Instructions for Worksheet #13
71Worksheet #13 — Alice the Fifth
72The position Property
73position: relative
74Instructions for Worksheet #14
75Worksheet #14 —Making a Peanut Butter and Jelly Sandwich
76position: absolute
77Absolute Positioning: Example
78Instructions for Worksheet #15 — minor corrections 8/16/04
79Worksheet #15
80position: fixed — Mozilla only
81Instructions for Worksheet #16
82Worksheet #16: A Quick Guide to CSS
83CSS Positioning: Z-Index
84Instructions for Worksheet #17
85Worksheet #17
86Background Image — Mozilla only
87Instructions for Worksheet #18 // Values: none and "0"
88Worksheet #18 — Alice the Sixth
89Inline Styles
90What's Next?
CSS References and Resources
How to Use the Class Tools — minor corrections 8/16/04
Links to CSS Resources
Worksheet Checklist: Help in Tracking Down Those "Slims"
All class files — compressed in Mac SIT format — Updated 8/16/04
All class files — compressed in PC ZIP format — Updated 8/16/04
Bergen County Internet Tutor — Web site home