Odd and even are keywords that can be used to match child elements whose index is odd or even (the index of the first child is 1).
n can be a number, a keyword, or a formula.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
div:nth-child(odd) {
background-color: red;
color: yellow;
}
div:nth-child(even) {
background-color: black;
color: white;
}
</style>
</head>
<body>
<div>This is the First Div</div>
<div>This is the Second Div</div>
<div>This is the Third Div</div>
<div>This is the Fourth Div</div>
<div>This is the Fifth Div</div>
<div>This is the Sixth Div</div>
<div>This is the Seventh Div</div>
</body>
</html>
Output:- This is the First Div
This is the Second Div
This is the Third Div
This is the Fourth Div
This is the Fifth Div
This is the Sixth Div
This is the Seventh Div
Css:- nth- child odd and even
Reviewed by Network security
on
May 12, 2019
Rating:
Reviewed by Network security
on
May 12, 2019
Rating:
No comments: