标签：round splay container 语法 none ide lap 页面布局 display
高级选择器分为：后代选择器、子代选择器、并集选择器、交集选择器
使用空格表示后代选择器。顾名思义，父元素的后代（包括儿子，孙子，重孙子）
1 .container p{ 2 color: red; 3 } 4 .container .item p{ 5 color: yellow; 6 }
使用>表示子代选择器。比如div>p,仅仅表示的是当前div元素选中的子代(不包含孙子....)元素p。
1 .container>p{ 2 color: yellowgreen; 3 }
多个选择器之间使用逗号隔开。表示选中的页面中的多个标签。一些共性的元素，可以使用并集选择器
1 /*并集选择器*/ 2 h3,a{ 3 color: #008000; 4 text-decoration: none; 5 6 }
比如像百度首页使用并集选择器。
body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td {
margin: 0;
padding: 0
}
/*使用此并集选择器选中页面中所有的标签，页面布局的时候会使用*/
交集选择器
使用.表示交集选择器。第一个标签必须是标签选择器，第二个标签必须是类选择器 语法：div.active
比如有一个<h4 class=‘active‘></h4>这样的标签。
那么
1 h4{ 2 width: 100px; 3 font-size: 14px; 4 } 5 .active{ 6 color: red; 7 text-decoration: underline; 8 } 9 /* 交集选择器 */ 10 h4.active{ 11 background: #00BFFF; 12 }
它表示两者选中之后元素共有的特性。
标签：round splay container 语法 none ide lap 页面布局 display
原文地址：https://www.cnblogs.com/majj/p/9026579.html
