Certified CSS Designer

TABLE OF CONTENT

​

1 CSS Basics

• 1.1 Introduction
• 1.2 Why to use CSS
• 1.3 CSS Editors
• 1.4 A CSS Example
• 1.5 Custom CSS
• 1.6 Cross Browser Testing
• 1.7 Including CSS
• 1.8 Validating CSS

2 CSS Components

• 2.1 CSS Components
• 2.2 Rules
• 2.3 Selectors (Grouping & Type)
• 2.4 Declaration Block
• 2.5 Property
• 2.6 Value
• 2.7 Keywords(Auto, Multiple & String)
• 2.8 Lengths
• 2.9 Relative Units (px, em, ex, %)
• 2.10 Numbers
• 2.11 Colors
• 2.12 URL()
• 2.13 Quirks Mode

3 Selectors

• 3.1 Selector Basics
• 3.2 Tag Selectors
• 3.3 Class Selector
• 3.4 ID Selectors
• 3.5 Group Selector
• 3.6 HTML Hierarchy
• 3.7 Descendant Selector
• 3.8 Universal Selector

4 Advanced Selectors

• 4.1 Pseudo-classes and Pseudo-Elements
• 4.2 Pseudo-Classes for Links
• 4.3 Direct Child Selectors
• 4.4 Next Sibling Selector
• 4.5 Attribute Selectors
• 4.6 Pseudo-Elements :First-Letter And :First-Line
• 4.7 Advanced Pseudo-Classes

5 Cascade and Inheritance

• 5.1 Inheritance Basics
• 5.2 Why Inheritance
• 5.3 Inheritance Rules
• 5.4 Cascade Basics
• 5.5 CSS Specificity: An Overview
• 5.6 What is Specificity?
• 5.7 Specificity hierarchy
• 5.8 Finding Selector’s Specificity
• 5.9 !important Usage

6 Applying Font Formatting

• 6.1 Font Formatting Basics
• 6.2 Font-Family
• 6.3 Font Combinations
• 6.4 Font-Style
• 6.5 Font-Weight
• 6.6 Text-Transform
• 6.7 Text-Decoration
• 6.8 Font-Variant
• 6.9 Font Size
• 6.10 Font Shorthand

7 Text Display Control

• 7.1 Text Display Basics
• 7.2 Line-Height
• 7.3 Letter-Spacing
• 7.4 Word-Spacing
• 7.5 Text- Indent
• 7.6 Text Align
• 7.7 White Space Property
• 7.8 Adding Color to Text

8 Page Background

• 8.1 Background Basics
• 8.2 Background-Color
• 8.3 Background-Image
• 8.4 Background-Repeat
• 8.5 Background-Position
• 8.6 Background-Attachment
• 8.7 Background Shorthand

9 CSS Box Model

• 9.1 Box Model Basics
• 9.2 Margin
• 9.3 Margin Collapsing
• 9.4 Margin for Horizontal Alignment
• 9.5 Border
• 9.6 Padding
• 9.7 Height and Width
• 9.8 IE quirks mode
• 9.9 Min and Max Dimensions
• 9.10 Overflow Property

10 Float

• 10.1 Float Basics
• 10.2 Float Property
• 10.3 Clear Property
• 10.4 IE 6 Float Bugs
• 10.5 Bug Removal Technique
• 10.6 Vertically Aligning Content

11 Positioning

• 11.1 Positioning Basics
• 11.2 Positioning Introduction
• 11.3 Relative Positioning
• 11.4 Absolute Positioning
• 11.5 Fixed Positioning
• 11.6 Z-INDEX

12 Styling Lists

• 12.1 List Styling Basics
• 12.2 List Tags
• 12.3 List-Style-Type Property
• 12.4 List-Style-Image Property
• 12.5 List-Style-Position Property
• 12.6 List-Style Shorthand Property

13 Styling Tables

• 13.1 Table Styling Basics
• 13.2 Table Elements
• 13.3 Captions
• 13.4 Columns
• 13.5 Table Layout
• 13.6 Borders Collapsing
• 13.7 Border Spacing

14 Print Styling

• 14.1 Print Styling Basics
• 14.2 Print Style Sheets Advantages
• 14.3 Applying Styles Based On Media
• 14.4 The @media rule
• 14.5 Page Breaks
• 14.6 Content Property
• 14.7 Print Style Sheets Tips

15 Customizing styles

• 15.1 Customizing Basics
• 15.2 Custom Fonts
• 15.3 Gradient Backgrounds
• 15.4 Custom Mouse Cursor
• 15.5 Custom Opacity
• 15.6 Custom Visibility

COURSE OUTLINE

​

1 CSS Basics

• Basics of CSS
• Utility of CSS
• Editors to use for CSS
• Testing across different browser
• Referring CSS in HTML file
• Steps to Validate CSS

2 CSS Components

• Parts of CSS Rule
• Explaining Selectors (Grouping & Type)
• Illustrating Declaration Block
• What is Property and Value
• Detailing Keywords(Auto, Multiple & String)
• Different Lengths
• Relative Units (px, em, ex, %) in CSS
• How to use Numbers in CSS
• Explaining Colors in CSS
• URL() usage
• Quirks Mode in CSS

3 Selectors

• Selector Basics
• Explaining Tag Selectors
• Detailing Class Selector
• Illustrating ID Selectors
• What are Group Selector
• Details on HTML Hierarchy
• Explaining Descendant Selector
• What are Universal Selector

4 Advanced Selectors

• Illustrating Pseudo-classes and Pseudo-Elements
• Detailing Pseudo-Classes for Links
• Explaining Direct Child Selectors
• What is Next Sibling Selector
• Attribute Selectors in CSS
• What are Pseudo-Elements :First-Letter And :First-Line
• Advanced Pseudo-Classes in CSS

5 Cascade and Inheritance

• Basics of Inheritance
• Why Inheritance to use
• Inheritance Rules in CSS
• Cascade in CSS
• CSS Specificity: An Overview
• What is Specificity?
• Explaining Specificity hierarchy
• Finding Selector’s Specificity
• Usage of !important

6 Applying Font Formatting

• Font Formatting Basics
• Font-Family
• Font Combinations
• Font-Style
• Font-Weight
• Text-Transform
• Text-Decoration
• Font-Variant
• Font Size
• Font Shorthand

7 Text Display Control

• Text Display Basics
• Line-Height
• Letter-Spacing
• Word-Spacing
• Text- Indent
• Text Align
• White Space Property
• Adding Color to Text

8 Page Background

• Background Basics
• Background-Color
• Background-Image
• Background-Repeat
• Background-Position
• Background-Attachment
• Background Shorthand

9 CSS Box Model

• Box Model Basics
• Margin
• Margin Collapsing
• Margin for Horizontal Alignment
• Border
• Padding
• Height and Width
• IE quirks mode
• Min and Max Dimensions
• Overflow Property

10 Float

• Float Basics
• Float Property
• Clear Property
• IE 6 Float Bugs
• Bug Removal Technique
• Vertically Aligning Content

11 Positioning

• Positioning Basics
• Positioning Introduction
• Relative Positioning
• Absolute Positioning
• Fixed Positioning
• Z-INDEX

12 Styling Lists

• List Styling Basics
• List Tags
• List-Style-Type Property
• List-Style-Image Property
• List-Style-Position Property
• List-Style Shorthand Property

13 Styling Tables

• Table Styling Basics
• Table Elements
• Captions
• Columns
• Table Layout
• Borders Collapsing
• Border Spacing

14 Print Styling

• Print Styling Basics
• Print Style Sheets Advantages
• Applying Styles Based On Media
• The @media rule
• Page Breaks
• Content Property
• Print Style Sheets Tips

15 Customizing styles

• Customizing Basics
• Custom Fonts
• Gradient Backgrounds
• Custom Mouse Cursor
• Custom Opacity
• Custom Visibility