Type Selectors
·
Universal Selector
CSS has a
special selector (*) which means it matches every element in the document. This selector is
useful in when name of elements are unknown while developing the style sheet.
For example:-
* {color: green; }
·
Descendent selector
This selector is also known as contextual
selector. In style sheet it is applied to a particular element only when it lies inside a particular
element. It provides a better way to apply style to very particular elements. This
selector is consisting of one or more selector separated by white spaces.
·
Child selector
This is similar to the descendent selector. It selects the element
which is just immediate children of the specific element. It is denoted by the >.
It can be writing as follow:-
Ø Body > * - it select all the children of the <body>element
Ø Body > * > * - it select all the grandchildren of the <body>element
Ø Body > * > p - it select all <p> grandchildren of the <body>element
For example
Ol { list-style-type: decimal; }
Ol > Ol { list-style-type: upper roman; }
Ol > Ol > Ol { list-style-type: lower-roman; }
·
Attribute selector
This selector is way of selecting elements depending on the
presence of an attribute or attributes values.
·
Class selector
Class selector provide A easier way of
apply the elements to the element. it find the element with the specific class.
For example:-
.left
{ text-align:left;
color:blue;
}
·
ID selector
The id attribute is a unique in
the document. It means are no two id attribute having the same value. To find
an element with a specific id, id selector is defined by a hash character,
followed by the id of the element.
The style rule
below will be applied as follow with id="p1":
#P1{color:blue;
Text-align:left;
}
Comments