0

我正在尝试学习新的 CSS3 选择器，因此尝试了以下代码：

<body class="frontpage">
    <section name="top">
        <header class="head" name="top">
            <div id="my-name">
                <h1 id="title">
                    Josh Dempsey
                </h1>
            </div>
        </header>   
    </section>
</body>

使用 CSS：

body[class*="f"]>section[name$="op"]>header[class|top]>div[id*="my"]>h1[id=title]{color:white;}

我希望我的名字印成白色，而不是黑色/自动。

我的其他 CSS 以防任何人从中找到任何东西：

body[class*="fro"]{background-color:#f8efe1;height:auto;width:auto;direction:ltr;z-     index:1;}
section[name*="t"]{position:absolute;top:0px;left:0px;width:100%;height:100px;}
header[class$="ad"]{background-color:#272727;height:100%;width:100%;}
h1[class="title-of-site"]{color:white;font-family:'Open Sans',sans-serif;font-  weight:300;margin:0}
header[class$="op"]>div[name*=image_holder]  {position:absolute;top:5px;left:10%;bottom:5px;height:40px;width:40px;background-color:
transparent;}

我在 W3.org 上检查了所有这些并成功验证了它。所以我被这个难住了。谢谢。

4

3 回答 3

4

您在选择器中遇到了一些语法问题（主要是值周围的引号）。

选择器不工作的原因是你header[class|top]指向了错误的属性，因为 header 有class="head". 您需要将其更改为名称并在垂直线后放置一个等号。

header[name|="top"]

这是下面工作的完整选择器：

body[class*="f"] > section[name$="op"] > header[name|="top"] > div[id*="my"] > h1[id="title"]
{
    color:white;
}
于 2013-09-27T13:36:35.503 回答
2

替换header[class|top]为header[class|name="top"]。

于 2013-09-27T13:31:00.837 回答
1

您可以尝试在 h1 上将 'class' 替换为 'id'。此外，更改h1[class="title-of-site"]为h1[id="title"].

请参阅此演示。

于 2013-09-27T13:41:30.813 回答