Header Ads

Grouping and Nestig of Selectors




In style sheets there are font elements with the same style.

Code Snippet demonstrates elements with same style.

h1
{
color:green;
}

h2
{
color:green;
}

p{
color:green;
}
To reduce the code, developers can group selectors. Separate each selector with a comma.
Code Snippet  displays the grouping of selectors.


h1,h2,p
{
color:green;
}
It is also possible to apply a style for a selector within a selector. Code Snippet  demonstrates
the nesting of selectors.
p{
color:green;
}
.changed
{
background-color:red
}
In the code, a style is specified for all the paragraphs and another style is specified for all
elements whose class attribute has the value set to changed.

No comments:

Powered by Blogger.