Question

为什么我不能选择header:nth-of-type(1)的第一个标题元素。这是代码，但jsfiddle不支持documentation。 我需要用LESS写

我也试过了:first-child和nth-child(1)，但不幸的是，这对我没用...

Answer 1

因为您始终是另一个标签背后的元素，因此它始终是第一个。尝试使用＆＃34;＆gt;＆＃34;作为元素之后的元素。看到。例如

#wrapper {
    background: white;
    height: 100%;
    width: 1720px;
    margin: 0 auto;
    border: 3px solid #707070;

    > header:nth-child(1) {
        margin: 0 auto;
        width: 90%;
        height: 200px;
        background: red;
        border: 3px solid #707070;

        h1 {
            color: #707070;
        }
    }
}

并不好好使用这么多嵌套。结果css看起来很糟糕

html body #wrapper > header:child(1) h1 .......

更好的是

* {}
html {}
body {}
#wrapper {
    header:nth-of-type(1) {     
        h1 {
        }
    }
}

Answer 2

您需要>选择器指定它是#wrapper

的直接子项

    #wrapper {
        background: white;
        height: 100%;
        width: 1720px;
        margin: 0 auto;
        border: 3px solid #707070;

        >header:nth-of-type(1) {
            margin: 0 auto;
            width: 90%;
            height: 200px;
            background: red;
            border: 3px solid #707070;

            h1 {

                color: #707070;
            }

        }
    }

证明：http://jsfiddle.net/T2Xe9/375/

选择LESS类型的第一个元素

2 个答案: