Saturday, October 12, 2013

Selecting Selectors

There are four kinds of selectors in CSS:

Selectors

Element Selectors: selects allelements of a 
specific type/tag (<body>, <h1>, <p>, etc.)
Example:
h3
{
color: #009e54;
font-weight: bold;
}

Class Selectors: selects all elements that belong 
to a given class.
Example:
class=“myClass”
.myClass
{
color: #009e54;
font-weight: bold;
}

ID Selectors: selects a single element that’s been 
given a unique id.
Example:
id=“mainPage”
#mainPage
{
color: #009e54;
font-weight: bold;
background-color: #4285f4;
}

Pseudo Selectors: combines a selector with a 
user activated state(:hover, :visited)
Example:
a:hover
{
color: #009e54;
font-weight: bold;
}

By the way, you can also group your selectors, just like this:
Group Selectors:
h1, .myClass, #mainPage
{
font-size: 20pt;
}


No comments:

Post a Comment