CSS selectors are used to select (or find) the content or HTML Element which we want to style and apply some text formatting.
The element selector selects the HTML element by name.
p {
text-align: center;
color: blue;
}
The CSS Id Selector select the id attribute of an HTML element to select a specific element.
To select an element with a specific id, write a hash (#
) character, followed by the id of the element.
#paragraph-1{
text-align: center;
color:green;
}
The class selector selects HTML elements using the specific class attribute.
Selected HTML Element with a specific class write with a period character(.
) followed by the class name.
.center {
text-align: center;
color: red;
}
h4.center {
text-align: center;
color: blue;
}
The universal selector(*
) is used as a wildcard character and it selects all the elements on the pages.
* {
text-align: center;
color: blue;
}
The group selector is used to select all the HTML elements with the same style definitions.
Generally the group selector is used to minimize the code.
If we want to apply same style on one or more html element we should use the css group selector.
Example :
h1, h2, p {
text-align: center;
color: red;
}