一、通配符选择器
*{  }
*{
margin:0px;
padding:0px;
}
**************************************************************************************************
二、标签选择器
p{
font-size:30px;
color:red;
css选择器分为哪几类
font-family:"宋体";
}
*************************************************************************************************
三、类选择器
E.className{
}
< { font-size:14px; }
/* 所有class属性值等于（包含）"note"的div对象字体尺寸为14px */
.dream { font-size:14px; }
/* 所有class属性值等于（包含）"note"的对象字体尺寸为14px */
<{
font-size:19px;
color: green;
}
.myDream{
border-color:red;
border-width:12px;
border-style: solid;
}
*****************************************************************************************************
四、ID选择器
#ID{  }
#song{
font-family: "宋体";
color: orange;
font-size:20px;
}
*********************************************************************************************
五、分组选择器
E1，E2，E3，E4{
}
h1,h2 ,h3,h4,h5,h6,h7{
color:red;
}
.td1,div a,table{ font-size:14px; }
****************************************************************************************************\
六、相邻同胞选择器
E + p{
}
h1+p{
font-weight:bold;
}
<h1>Main Heading</h1>
<p>First Paragraph</p>
<p>Second Paragraph</p>
****************************************************************************************************\
七、属性选择器
htmlLabel[attribute] 选择具有attribute属性的htmlLabel标签
htmlLabel[attribute=value] 选择具有attribute属性的htmlLabel ， 并且等于value的元素
htmlLabel[attr~=value] 选择具有attr属性且属性值为一用空格分隔的字词列表，其中一个等于value的E1。这里的value不能包含空格
htmlLabel[attr|=value]  选择具有attr属性且属性值为一用连字符分隔的字词列表，由value开始的E1
h[title] { color: blue; }
/* 所有具有title属性的h对象 */
span[class=demo] { color: red; }
div[speed="fast"][dorun="no"] { color: red; }
a[rel~="copyright"] { color:black; }
*******************************************************************************************************
八、子对象选择器
E1>E2 选择所有E1的子元素为E2的元素
body > p { font-size:14px; }
/* 所有作为body的子对象的p对象字体尺寸为14px */
div ul>li p { font-size:14px; }
******************************************************************************************************
九、子串匹配的属性选择符 E[att^="val"]
匹配具有att属性，并且att属性值是以val开头的E元素
p[title^="song"] {color:#fff}
<p title="songdelong">bamboo_song</p>
**********************************************************************
****************************
十、子串匹配的属性选择符 E[att$="val"]
匹配具有att属性，并且att属性值是以val结尾的E元素
p[title="long"]{font-size:30px;}
<p title="it's too long"> song  delong</p>
*****************************************************************************************************
十一、子串匹配的属性选择符 E[att*="val"]
匹配具有att属性， 并且att属性值含有val的E元素
p[title*="oo"]{font-size:45px;}
<p title="bamboo">bamboo is kink</p>
****************************************************************************************************
十二、通用兄弟元素选择器 E ~ F
匹配所有E之后的子元素的F元素
div~p{background-color:#00ff00;}
<div>
<p>songdelong</p>
<p>bamboo</p>
<p>chongqing</p>
<p>sichuang</p>
</div>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。