1 /*伪对象选择符*/ 2 .main:first-letter{float:left;color:blue;font-size:3em;font-weight:bold} 3 .main:first-line{color:red;font:bold 1.5em 黑体,宋体} 4 /*子对象选择符*/ 5 .te >#ll { 6 font-size:100px; 7 } 8 /*相邻选择符*/ 9 span+p{ 10 color:red; 11 } 12 /*相邻选择符*/ 13 .one + .two{ 14 color:blue; 15 } 16 17 /*属性选择符*/ 18 /*属性存在*/ 19 .d[id]{ 20 color:red; 21 font-size=20px; 22 } 23 /*精确匹配*/ 24 .dd[id="123"]{ 25 color:blue; 26 } 27 /* 前缀匹配*/ 28 .dddd[id^="123"] { 29 color:red; 30 } 31 /* 后缀匹配*/ 32 .dddd[id$="123"] { 33 color:blue; 34 } 35 /*子串匹配*/ 36 .sec[id*="3333"] { 37 color:yellow; 38 } 39 /* 连接字符匹配 eg:本例中的33 ,只有 id=33或者id=33-内容 会匹配*/ 40 .third[id|="33"]{ 41 font-size:50px; 42 } 43 /*空白符匹配*/ 44 .forth[id~="cat"]{ 45 color:green; 46 }