Child selectors can be used for applying the style for parent element and this will descend to the child elements. Below is the example -
body > input{
color: #FFFFF1;
}Pseudo-elements are used to add special effects to some selectors. CSS in used to apply styles in HTML mark-up. In some cases when extra mark-up or styling is not possible for the document, then there is a feature available in CSS known as pseudo-elements. It will allow extra mark-up to the document without disturbing the actual document.
Overlapping may occur while using CSS for positioning HTML elements. Z index helps in specifying the overlapping element. It is a number which can be positive or negative, the default value being zero.
<i> or <span>) . Icons in the icon libraries are scalable vectors that can be customized with CSS.ul {
list-style-type: none;
margin: 0;
padding: 0;
}Body {background: #FF00FF !important; color: blue}width and height
max-width and max-height
min-width and min-height
hi (i=1-6)- heading element
p- Paragraph element.<style>
img{
height:250px;
width:250px;
opacity:50px;
}
</style><style>
div {
background-image:url(freetimelearn_logo.jpeg);
background-repeat:no-repeat;
}
</style>.left_side{
width:30%;
}
.left_side{
width:40% !important;
} .right_side{
float: right;
width:30%;
}p {
text-indent: 50px;
}div {
transform: rotate(45deg);
transform-origin: 20% 40%;
}p {
hanging-punctuation: first;
}body {
/* Set “my-sec-counter” to 0 */
counter-reset: my-sec-counter;
}
h2:before {
/* Increment “my-sec-counter” by 1 */
counter-increment: my-sec-counter;
content: “Section ” counter(my-sec-counter) “. “;
}#div1 {
backface-visibility: hidden;
}
#div2 {
backface-visibility: visible;
}#div1 {
position: absolute;
left: 50px;
width: calc(100% – 100px);
border: 1px solid black;
background-color: yellow;
padding: 5px;
text-align: center;
}div {
width: 150px;
height: 150px;
background: blue;
transition: width 2s;
transition-timing-function: cubic-bezier(0.1, 0.7, 1.0, 0.1);
}