子元素选择器
+兄弟选择器
通用兄弟节点选择器pb
[ ]通用选择器
[id]附带id属性的
div[ id]div中具有[ id]通用他们之间没有空格
[id][class]附带id class 属性的
/div中值为class="we"这个才会按照这个样式显示/
div[class="we"]{background: red;
color:red;
}
/div中以c开头的才按这个样式显示/
div[class^="c"]{
background: green;
}
/div中以m结尾的才按这个样式显示/
div[class$="m"]{
background: blue;
}
/div中具有w的按这个样式显示/
div[class="w"]{
background: #ccc;
}
class^=“c" class$=“m”（以c开头以m结尾class换成id也成）
/class里只有有其中一个属性值就行*/
div[class~="bbba"]
{
background: red;
}
<div class="bbba xxxs cccz"></div>
:target目标
伪类；
<input enabled>可用
<input disabled>不可用
input:enabled{
background-color: blue;
}
input:disabled{
background-color: red;
}
input:checked{
background-color: green;
}选中变化
p:first-child{
color: red;
}第一个元素变
last最后一个元素变
empty空元素变
only只有一个
input：not（[type=“text]）{
}不是type=“text按这个显示
first-letter首字
：：selection选中的变
：before在什么前面
:after在上面后面
{content:能容}
counter
/重置计数器/
body{
counter-reset: charpter;
}
/通过counter（）实现计数/
h1:before{
content: "第"counter(charpter)"章"
}
/指定增长幅度/
h1{counter-increment: charpter;
}
-webkit-
-zom-
p{width: 300px;
/分成三列/
column-count:3;
/列间的间隔/
column-gap:20px;
/列间虚线/
column-rule:2px dashed red;
}
