CSS 选择器
原创
©著作权归作者所有：来自51CTO博客作者jiankunking的原创作品，请联系作者获取转载授权，否则将追究法律责任
1、ID选择器
2、CLASS选器
3、属性选择器
可以为拥有指定属性的 HTML 元素设置样式，而不仅限于 class 和 id 属性。
注释：只有在规定了 !DOCTYPE 时，IE7 和 IE8 才支持属性选择器。在 IE6 及更低的版本中，不支持属性选择。
CSS 选择器参考手册
具体demo与语法参考：
w3school
4、选择器分组
w3school
5、包含选择器（后代选择器）
w3school
6、标签指定式的选择器
如果想同时使用id和class，也想同时使用标签选择符，可以使用如下的方式：
/*表示所有id为idDemo的p标签*/
p#idDemo {
background: cadetblue;
font-size: 36px;
}
/*表示所有class为classDemo的h1标签*/
p.classDemo {
background: cadetblue;
font-size: 36px;
}
/*小注：标签指定式的选择符用#或者.来连接，中间不能有空格*/
效果如下：
测试代码：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta charset="utf-8" />
<style type="text/css">
/** {
font-size: 12px;
line-height: 1.5;
color: blue;
}*/
body {
font-size: 12px;
line-height: 1.5;
color: blue;
}
/*
包含选择符
对某对象中的子对象进行样式指点定，这样选择方式就发挥了作用。
需要注意的是，仅对此对象的子对象标签有效，对于其它单独存在或位于此对象以外的子对象，不应用此样式设置。
这样做的优点在于，帮我们避免过多的id、class设置，直接对所需的元素进行定义。*/
p strong {
font-size: 36px;
color: red;
}
/*注意下面这种*/
#fi strong {
font-size: 24px;
color: brown;
background: cadetblue;
}
/*群组选择符
对于XHMTL对象，可以对一组同时进行了相同的样式指派。
使用逗号对选择符进行了分隔，这样书写的优点在于同样的样式只需要书写一次即可，减少代码量，改善CSS代码结构。
使用时应该注意”逗号”是在半角模式下，并非中文全角模式。*/
h2, h3 {
font-weight: normal;
}
/*表示所有id为idDemo的p标签*/
p#idDemo {
background: cadetblue;
font-size: 36px;
}
/*表示所有class为classDemo的h1标签*/
p.classDemo {
background: cadetblue;
font-size: 36px;
}
/*小注：标签指定式的选择符用#或者.来连接，中间不能有空格*/
</style>
</head>
<body>
<h1> 真正的才智是刚毅的志向。 —— 拿破仑</h1>
<h2>
感情有着极大的鼓舞力量，因此，它是一切道德行为的重要前提，谁要是没有
强烈的志向，也就不能够热烈地把这个志向体现于事业中。 —— 凯洛夫
</h2>
<div>勇敢坚毅真正之才智乃刚毅之志向。 —— 拿破仑</div>
<p id="idDemo">
生活赋予我们一种巨大的和无限高贵的<strong>礼品</strong> ，这就是青春：充满着力量，充满着期待志愿，充满着求知和斗争的志向，充满着希望信心和青春。 —— 奥斯特洛夫斯基
<br />
志向不过是记忆的奴隶，生气勃勃地降生，但却很难成长。 —— 莎士比亚
</p>
<p id="fi">人所缺乏的不是才干而是<strong>志向</strong>，不是成功的能力而是勤劳的意志。 —— 部尔卫</p>
<h3>
当教师把每一个学生都理解为他是一个具有个人特点的、具有自己的志向、自己的智慧和性格结构的人的时候，这样的理解才能有助于教师去热爱儿童和尊重儿童。 —— 赞科夫
</h3>
<p class="classDemo">
555555555555555555555555555555555555555555
</p>
</body>
</html>
