包含选择与子对象选择符的区别
包含选择符的写法：body p{ color:red;} 意思是body下所有的P元素的字都显示红色
子对象选择符的写法： body>p{color:red;} 意思是body下的子元素的字都显示红色
如果还是是理解的话，那就来看个例子最实际了。
<body>
<p>传说中的测试</p>
<div><p>传说中的测试</p></div>
<p>传说中的测试</p>
<div><p>传说中的测试</p></div>
</body>
对于上面这段代码，使用包含选择符时的结果是：
使用子对象选择符时的结果是：
明白了吧，使用包含选择符，可以使用body下所有的p元素都显示红色。而使用子对象选择符，对于div下的p不显示红色，因为div下的p不是body的儿子，而是body的孙子了，所以不会起作用。
子对象选择符的写法： body>p{color:red;} 意思是body下的子元素的字都显示红色
如果还是是理解的话，那就来看个例子最实际了。
<body>
<p>传说中的测试</p>
<div><p>传说中的测试</p></div>
<p>传说中的测试</p>
<div><p>传说中的测试</p></div>
</body>
对于上面这段代码，使用包含选择符时的结果是：
使用子对象选择符时的结果是：
明白了吧，使用包含选择符，可以使用body下所有的p元素都显示红色。而使用子对象选择符，对于div下的p不显示红色，因为div下的p不是body的儿子，而是body的孙子了，所以不会起作用。
浙公网安备 33010602011771号