Grouping Selectors
In style sheets there are often elements with the same style.
EXAMPLE:
h1
{
color:green;
}
h2
{
color:green;
}
p
{
color:green;
}
{
color:green;
}
h2
{
color:green;
}
p
{
color:green;
}
To minimize the code, you can group selectors.
Separate each selector with a comma.
In the example below we have grouped the selectors from the code above:
Example;
| h1,h2,p { color:green; } |
Nesting Selectors
It is possible to apply a style for a selector within a selector.
In the example below, one style is specified for all p elements, one style is specified for all elements with class="marked", and a third style is specified only for p elements within elements with class="marked":
Example
| p { color:blue; text-align:center; } .marked { background-color:red; } .marked p { color:white; } |
