语法
:nth-of-type(number) {
css declarations;
}
:nth-of-type() 选择器示例：
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
<style>
p:nth-of-type(3) {
background: #8ebf42;
}
</style>
</head>
<body>
<h2>:nth-of-type() selector example</h2>
<p>Paragraph 1</p>
<p>Paragraph 2</p>
<p>Paragraph 3</p>
</body>
</html>
指定为“奇数”和“偶数”的 :nth-of-type 示例：
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
<style>
p:nth-of-type(odd) {
background: #1c87c9;
}
p:nth-of-type(even) {
background: #8ebf42;
}
</style>
</head>
<body>
<h2>nth-of-type() selector example</h2>
<p>第 1 段</p>
<p>第 2 段</p>
<p>第 3 段</p>
<p>第 4 段</p>
<p>第 5 段</p>
<p>第 6 段</p>
<p>第 7 段</p>
<p>第 8 段</p>
<p>第 9 段</p>
<p>第 10 段</p>
</body>
</html>
:nth-of-type() 伪类根据它们的索引选择相同类型的元素。
:nth-of-type() 可以由数字、关键字或者公式指定。
:nth-of-type 选择器类似于 :nth-child 但有一个区别：它更具体。
:nth-of-type 仅针对与类似兄弟姐妹相关的排列中某种类型的元素。
日期：2020-06-02 22:14:40 来源：oir作者：oir