CSS 元素选择器/类型选择器
最常见的 CSS 选择器是元素选择器。
html {color:black;}
p {color:gray;}
h2 {color:silver;}
分组:
body, h2, p, table, th, td, pre, strong, em {color:gray;}
CSS 类选择器
提示:只有适当地标记文档后,才能使用这些选择器,所以使用这两种选择器通常需要先做一些构想和计划。
要应用样式而不考虑具体设计的元素,最常用的方法就是使用类选择器。
.important {color:red;}
p.important {color:red;}
h1.important {color:blue;}
分组
.important.warning {background:silver;}
ID选择器
1 唯一
2 不能结合使用
3 包含更多含义
#intro {font-weight:bold;}
后代选择器
h1 em {color:red;}
div.sidebar {background:blue;}
** 子元素选择器**
如果您不希望选择任意的后代元素,而是希望缩小范围,只选择某个元素的子元素,请使用子元素选择器(Child selector)
<h1>This is <strong>very</strong> <strong>very</strong> important.</h1>
<h1>This is <em>really <strong>very</strong></em> important.</h1>
h1 > strong {color:red;}
这个规则会把第一个 h1 下面的两个 strong 元素变为红色,但是第二个 h1 中的 strong 不受影响: