Pre
浏览器兼容问题：
IE：微软的浏览器，随着操作系统安装的，所以每个window都有IE浏览器。
windows xp操作系统安装的IE6
windows vista操作系统安装的IE7
windows 7操作系统安装的IE8
windows 8操作系统安装的IE9
windows10操作系统安装的edge
一般来说IE6、7由于版本低级，经常存在浏览器的兼容问题。
1.交集选择器，如：
h3.special｛
color:red;
｝
选择的元素需同时满足两个条件——必须是h3标签，且必须是special标签。
交集选择器没有空格，所以div.red和div .red不是同一个意思。
交集选择器可以连续交，虽然一般并不这么写。
h3.special.zhongyao{
color:red;
}
2.并集选择器（分组选择器）：用逗号表示
h3,li{
color:red;
}
3.通配符： *表示所有元素：
*{
color:red;
}
效率不高。页面上的标签越多，效率越低，所以页面上不太可能出现这个选择器。
4.儿子选择器：IE7开始兼容，IE6不兼容
<style type="text/css">
div>p{
color:red;
}
</style>
</head>
<body>
<div>
<p>猜猜我是什么颜色</p>
</div>
</body>
p标签相当于div标签的儿子。
以下情况无法选择，因为div的儿子是ul，不是p：
<style type="text/css">
div>p{
color:red;
}
</style>
</head>
<body>
<div>
<ul>
<li>
<p>猜猜我是什么颜色</p>
</li>
</ul>
</div>
</body>
5.序选择器：IE8开始兼容，IE6、7都不兼容。
<style type="text/css">
ul li:first-child{
color:red;
}
</style>
</head>
<body>
<ul>
<li>item</li>
<li>item</li>
<li>item</li>
</ul>
</body>
若是选择最后一个li，则ul li: last-child；选择第n个li，则ul li: nth-child。
由于浏览器更新需要过程，所以现在如果公司还要求兼容IE6、7，那么就要自己写类名，我们可以用类选择器来选择第一个或最后一个：
ul li.first{
color:red;
}
ul li.last{
color:blue;
}
6.下一个兄弟选择器：IE7开始兼容，IE6不兼容。+表示选择下一个兄弟
<style type="text/css">
h3+p{
color:red;
}
</style>
</head>
<body>
<h3>这是一个标题</h3>
<p>这是一个段落</p>
<p>这是一个段落</p>
<h3>这是一个标题</h3>
<p>这是一个段落</p>
<p>这是一个段落</p>
</body>
如果CSS选择器：
div.content div.news ul li.first{
}
则：
< div class="content">
< div class="news">
< ul>
< li class="first">< /li>
< li>< /li>
< li>< /li>
< li>< /li>
< /ul>
< /div>
</div>
5979
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
