CSS3的一些选择器

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_36719449/article/details/82817394

儿子选择器

IE7开始兼容，IE6不兼容。

div>p{
color:red;4
}
//div的儿子p。和div的后代p的是两个不同的概念。

能够选择 ：
<div>
<p>我是div的儿子</p>
</div>

不能选择:
<div>
	<ul>
		<li>
			<p>我是div的重孙子</p>
		</li>
	</ul>
</div>

序选择器

IE8开始兼容；IE6、7都不兼容

选择第1个li：
		<style type="text/css">
	    	ul li:first-child{
				color:red;
			}
		</style>

选择最后一个1i：
			ul li:last-child{
				color:blue;
			}

兄弟选择器

IE7开始兼容，IE6不兼容。
选择上的是h3元素后面紧挨着的第一个兄弟。

+表示选择下一个兄弟
	<style type="text/css">
		h3+p{
			color:red;
		}
	</style>
<h3>我是一个标题</h3>
<p>我是一个段落</p>// 这行会被选择上
<p>我是一个段落</p>
<p>我是一个段落</p>
<h3>我是一个标题</h3>
<p>我是一个段落</p>// 这行会被选择上
<p>我是一个段落</p>
<p>我是一个段落</p>
<h3>我是一个标题</h3>
<p>我是一个段落</p>// 这行会被选择上
<p>我是一个段落</p>
<p>我是一个段落</p>
<h3>我是一个标题</h3>