<style>ul li{
color: red } </style>
<ul>
<li>我是ul里面的li</li>
<li>我是ul里面的li</li>
<li>我是ul里面的li</li>
</ul> li是ul的孙子级别
<ul>
<p><li>我是ul里面的li</li></p>
<p><li>我是ul里面的li</li></p>
<p><li>我是ul里面的li</li></p>
</ul> li是ul的孙子级别
后代选择器两个选择符之间必须要以空格隔开，中间不能有任何其他的符号插入，空格可以多 但是不可以插入其他的符号以免造成干扰。 li 被 ul包裹的情况下 颜色变红
2.子选择器：E>F 选择匹配的F元素，且匹配的F元素是匹配的E元素的子元素
<style>div span{
color: red }
h2 >span{ color: green} </style>
<div>
<p><span>早上好</span></p>
<p><h1><span>我是标题</span></h1></p>
<h2><span>晚上好</span></h2>
</div>
div元素中包裹的子元素span 显示为红色，h2元素中包裹的子元素span显示为绿色，>左右可以添加空格
3.相邻选择器： E+F 相邻兄弟选择器 选择匹配的F元素，且匹配的F元素紧位于匹配的E元素后面
<style>.main+p{
background: green} </style>
<div> <p>我是谁</p>
<p class="main">我是谁</p>
<p>我是谁</p> </div>
类选择器main相邻的下一个p背景色变绿
4.通用选择器：E~F 通用兄弟选择器 选择匹配的F元素，且位于匹配的E元素后的所有匹配的F元素
<style> .ab~p{
background: red} </style>
<div> <p class="ab">111</p>
<p>222</p>
<p >333</p>
<p>444</p>
<p>555</p> </div>
类选择器ab下面的所有p标签都会变成红色
1.E[attr]属性选择器： E[attr] 选择匹配具有属性attr的E元素
<style> dd[class]{
background: red} </style>
<dl> <dt>汽车</dt>
<dd>宝马</dd>
<dd class>奔驰</dd>
<dd>奥迪</dd> </dl>
[ ]表示属性的意思 里面写具体属性的名称比如 [id]
2.E[attr=val]属性选择器:E[attr=val] 选择匹配具有属性attr的E元素,并且属性值为val（其中val区分大小写）
<style> dd[class=two]{
background: red } </style>
<dl> <dt>标题</dt>
<dd class="one">我是定义列表1</dd>
<dd class="one">我是定义列表1</dd>
<dd class="two">我是定义列表2</dd> </dl>
E[attr=val]属性选择器中，属性和属性值必须完全匹配才能被选中,dd元素中class的值为two的背景颜色变成红色
3.E[attr*=val]属性选择器: 选择匹配元素E，且E元素定义了属性attr，其属性值包含了“val”
dd[class=two]{<style>p[class*=b]
属性后面的值加不加引号（包括单引号和双引号）都可以 当时遇到特殊符号需要加引号
background: red } </style>
<div> <p >111</p>
<p class="b1">222</p>
<p class="b2">333</p> </div>
p元素中class的值只要包含b的背景色都会变成红色,
4.E[attr^=val]属性选择器:E[attr^=val] 选择匹配元素E，且E元素定义了属性attr，其属性值是以val开头的任意字符串
<style> a[href^='http://']{
background:red } </style>
在遇到匹配的字符 有特殊符号 比如 :号 // 可以使用引号（单引号和双引号）包裹一下
<a href="http://www.baidu.com">跳转百度</a>
<a href="www.baidu.com">不能跳转百度</a>
表示 属性href是以http开头的a元素 背景色变成红色
5.E[attr$=val]属性选择器:E[attr$=val] 选择匹配元素E，且E元素定义了属性attr，其属性值是以val结尾的任意字符串
a[href^='http://']{<style>a[href$=".cm"]
background:red } </style>
在遇到匹配的字符 有特殊符号 比如 :号 // 可以使用引号（单引号和双引号）包裹一下
<a href="http://www.baidu.com">能跳百度</a>
<a href="http://www.baidu.cn">因为百度把.cm的域名也买了所以也能跳了</a>
表示 属性href是以cn结尾的a元素 背景色变成红色
选定所有对象。
语法
以文档语言对象类型作为选择符。即 html 中的标签
语法
以唯一标识符 id 属性等于 myid 的 E 对象作为选择符。
语法
以 class 属性包含 myclass 的 E 对象作为选择符。
不同于 id 选择符 的唯一性，类选择符可以同时定义多个,并控制多个元素的样式
语法
群组选择器 (selector1,selectorN) 是将具有 相同样式 的元素分组在一起，每个选择器之间用逗号( , )隔开。
语法
后代选择器( E F )是选择 E 元素的所有后代 F 元素，不管 F 元素是 E 元素的子元素、孙元素或者更深层的关系，都会被选中。
语法
子选择器( E>F )是选择 E 元素的所有子后代 F 元素，注意 F 元素仅仅是 E 元素的子元素而已。
语法
兄弟选择器( E~F )是 CSS3 新增选择器，代表 E 和 F 具有同一个父元素，并且 F 元素在 E 元素后面，但是不用相邻。
例子
语法
相邻选择器( E+F )是 E 和 F 具有同一个父元素，并且 F 元素在 E 元素后面且相邻。
语法
简介
根据具有链接属性的 E 元素的被访问情况进行匹配。
例子
index.html
index.css
简介
根据用户对于 E 元素的操作来进行匹配。
例子
index.html
index.css
