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;
}
{
color:green;
}
h2
{
color:green;
}
p{
color:green;
}
To reduce the code, developers can group selectors. Separate each selector with a comma.color:green;
}
Code Snippet displays the grouping of selectors.
h1,h2,p
{
color:green;
}
{
color:green;
}
It is also possible to apply a style for a selector within a selector. Code Snippet demonstrates
the nesting of selectors.
the nesting of selectors.
p{
color:green;
}
.changed
{
background-color:red
}
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.
elements whose class attribute has the value set to changed.
No comments: