其他分享
首页 > 其他分享> > :nth-of-type()不起作用

:nth-of-type()不起作用

作者：互联网

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
    .test:nth-of-type(1) {
        background: pink;
    }
    </style>
</head>
<body>
    <h1>123</h1>
    <p>123</p>
    <h1 class="test">123</h1>
    <h1 class="test">123</h1>
</body>
</html>

最近同事碰到一个问题 background: pink;不生效，我看了一下官方文档。

.test:nth-of-type(1) {
     background: pink;
 }

这种写法本来就是不对的，但是也生效，他的作用是 获取 类为test 元素(标签)的父元素(标签)下和test相同元素(标签)的元素(标签)。所以说，我们最好还是按照官方的来。

标签：pink,不起作用,标签,nth,123,test,type
来源： https://blog.csdn.net/goutinga/article/details/122039712