今天小编跟大家讲解下有关css后代选择器和子选择器的区别介绍 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关css后代选择器和子选择器的区别介绍 的相关资料，希望小伙伴们看了有所帮助。
1.用法不同：比如要找div的class名为con中p标签 子代选择器用法：div.con>p{color:red;} 后代选择器：.con p{color:red;} 2.兼容性：ie6不支持子代选择器 3.所达到的效果不同 看下图用子代选择器效果： 复制代码代码如下: <!DOCTYPE html> <html> <head> <meta charset='utf-8'/> <title>CSS的子选择器</title> <style type="text/css"> *{margin:0;padding:0;} div.con>div>p{color:red;} </style> </head> <body> <div class='con'> <div>p <p>span1 <div> <p>span2</p> </div> </p> </div> </div> </body> </html> 看后代选择器效果： 复制代码代码如下: <!DOCTYPE html> <html> <head> <meta charset='utf-8'/> <title>CSS的子选择器</title> <style type="text/css"> *{margin:0;padding:0;} .con div p{color:red;} </style> </head> <body> <div class='con'> <div> <p>span1 <div> <p>span2</p> </div> </p> </div> </div> </body> </html>来源：爱蒂网
