0

我有一个关于 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>

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

我的问题是为什么带有 ID 测试的 H1 不是绿色字体？

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

谢谢！

4

2 回答 2

5

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

使用 ID 就足够了：

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

PS - 如果出于某种原因你真的想用 ID 指定元素类型（这对于 ID 应该是唯一的来说是非常多余的），你可以使用这个选择器：h1#test

于 2013-09-01T07:53:47.813 回答
2

我认为Italy是对的。如果您还想指示元素，您应该这样做：

h1#test { ... }
于 2013-09-01T07:57:50.967 回答