Home >Web Front-end >HTML Tutorial >How to select even columns of li in html
How to select even columns of li in html
- 醉折花枝作酒筹Original
- 2021-04-23 18:07:273706browse
You can use the ":nth-of-type()" selector to select the even columns of li in html, and the syntax is "li:nth-of-type(even){}". The ":nth-of-type(n)" selector matches child elements of a specific type of the parent element. When the value is even, it means matching elements with an even number.
The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.
You can use li:nth-of-type(even) {......} to select the even columns of li
Example:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8" />
<title></title>
<style>
#Ulist li:nth-of-type(even) {
background: royalblue;
}
</style>
</head>
<body>
<ul id="Ulist">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
</body>
</html>Effect:
Recommended learning: html video tutorial
The above is the detailed content of How to select even columns of li in html. For more information, please follow other related articles on the PHP Chinese website!