Selectors are a standout amongst the most imperative parts of CSS as they are utilized to choose components on a site page with the goal that they can be styled. You can characterize selectors in different ways.
Universal Selector
* {
margin: 0;
padding: 0;
}
margin: 0;
padding: 0;
}
* The style rules inside the selector will be applied to each element in a document.
Element Type Selector
h1 {
color: blue;
}
color: blue;
}
Id Selectors
#heading {
color: red;
}
color: red;
}
The ID selector is defined with a hash mark (#), immediately followed by an ID value.
Class Selectors
.blue {
color: blue;
}
color: blue;
}
The above style rules underline the text in blue in each element in the document in which the class attribute is set in blue. You can make it a bit more specifically, for example:
p.blue {
color: blue;
}
color: blue;
}
Descendant Selectors
ul.menu li a {
text-decoration: none;
}
h1 em {
color: green;
}
text-decoration: none;
}
h1 em {
color: green;
}
Child Selectors
ul > li {
list-style: square;
}
ul > li ol {
list-style: none;
}
list-style: square;
}
ul > li ol {
list-style: none;
}
Grouping Selectors
h1 {
font-size: 36px;
font-weight: normal;
}
h2 {
font-size: 28px;
font-weight: normal;
}
h3 {
font-size: 22px;
font-weight: normal;
}
font-size: 36px;
font-weight: normal;
}
h2 {
font-size: 28px;
font-weight: normal;
}
h3 {
font-size: 22px;
font-weight: normal;
}
h1, h2, h3 {
font-weight: normal;
}
h1 {
font-size: 36px;
}
h2 {
font-size: 28px;
}
h3 {
font-size: 22px;
}
font-weight: normal;
}
h1 {
font-size: 36px;
}
h2 {
font-size: 28px;
}
h3 {
font-size: 22px;
}
0 comments:
Post a Comment