Question

我有一个关于CSS和ID的快速问题。

这就是我的CSS代码：

h1  {
   font-family: 'Cabin', sans-serif;
   font-size: 36px;
   color: red;
}


#test h1 {
   color: green;
   font-size:10px;
}

我的HTML看起来像这样：

<html>
<head>
<link rel='stylesheet' href='style.css' type='text/css' media='all' />
<link href='http://fonts.googleapis.com/css?family=Cabin:600' rel='stylesheet' type='text/css'>
</head>
<body>
<h1 >asdfasdf<a href="/">test1</a></h1>
<h1 id="test">test</h1>
</body>
</html>

输出看起来像这样 - ＆gt; http://screencast.com/t/H2LOmJr7zd6f

我的问题是如何使用身份证测试的H1不是绿色字体？

如果在CSS中我将#test h1替换为#test，它将起作用。

谢谢！

Answer 1

您使用的是CSS ID选择器错误。您当前的选择器#test h1会选择h1元素元素，其ID为#test

使用ID就足够了：

#test {
   color: green;
   font-size:10px;
}

P.S - 如果由于某种原因你真的想要指定带有ID的元素类型（这对于ID而言应该是唯一的冗余），你可以使用这个选择器：h1#test

Answer 2

我认为Italy是正确的。如果你想表明元素，你应该这样做：

h1#test { ... }

CSS ID和属性顺序

2 个答案: