从上到下:
!important
#example {
font-size: 14px !important;
}
#container #example {
font-size: 10px;
}
行内样式
<div style="width:100px;height:100px;background:red;"></div>
id(权重是100)
<p id="intro">123</p>
#intro {font-weight:bold;}
class | 属性 | 伪类
<p class="intro">123</p>
.intro{
background-color:yellow;}
<h2>title="Hello world">Hello world</h2>
[title]{color:red;}
<p>These are the necessary steps:</p>
p:first-child {font-weight: bold;}
标签 | 伪元素
<p>123</p>
p{font-size: 20px;}
<div id="box"></div>
#box::before{
content: "";
}
#box::after{
content: "";
}
通配符
通配符使用星号*表示,意思是“所有的”。
*会匹配所有的元素,因此针对所有元素的设置可以使用*来完成,用的最多的例子如下:
*{margin:0px; padding:0px;}