1. Cascading Style Sheet External Style Sheet Example
Introducing Class selector
Class selector for a particular element
Class selector for any element
Menu Navigation Example
Introducing JavaScript Examples

2. Introducing Class Selectors
Class selectors are user made selectors. Selectors represent html tag names or element.
Class selector defines different style for the same type of html element

3. Class selector for a particular element
To create the class selector
Syntax: tagname.userdefinedNAME {……}
Example: h1.left {text-align: left;}
Example: h1.right {text-align: right;}
To use the class selector created in previous step
<h1 class=“left”>header is aligned left</h1>
<h1 class=“right”>header is aligned right</h1>

4. Class selector for any element
To define a style that can be used by all HTML elements,
Syntax: .userdefinedNAME {…….}
Example: .left {text-align: left;}
To use the above class selector,
<h1 class=“left”> header is aligned left</a>
<p class=“left”> paragraph is aligned left</a>