1、css語法
P{color:red}選擇符:P
聲明:{屬性:值}
括號
換行、空格不敏感
div{color:red;}
P{fontsize:14px;color:blue;}
h1{
? ? ?width:20px;
? ? ?height:200px;
? ? }
2、css設(shè)置樣式
案例:
p標(biāo)簽背景色為紅色
h1標(biāo)簽字體顏色為綠色
span標(biāo)簽文本為14像素
(1)嵌入式css(推薦)
? ? ? ? ?<style>
? ? ? ? ? ? ? ? ? ? ?p { background-color: red; }
? ? ? ? ? ? ? ? ? ? ?h1 { color: green; } ? ? ? ? ?
? ? ? ? ? ? ? ? ? ? ?span { font-size: 14px; }
? ? ? ? ? ?</style>
(2)行內(nèi)式css
<p style="background-color: red; ">我是一個段落標(biāo)簽</p>
3、css的注釋
單行注釋:/*注釋內(nèi)容*/
多行注釋:
/*
*/
注意:注釋不可嵌套
4、css的選擇器
(1)標(biāo)簽選擇器
(2)通配符選擇器:*{屬性1:屬性值1;屬性2:屬性值2;} ?其中*代表當(dāng)前頁面中的所有標(biāo)簽
通配符的穿透力很強(qiáng),優(yōu)先級高于繼承的樣式,會覆蓋繼承的樣式,一般不用。
例:通過通配符選擇器定義css樣式,清除所有HTML標(biāo)記的默認(rèn)邊距。
*{
margin:0; ? ?/*定義外邊距*/
padding:0; /*定義內(nèi)邊距*/
}
(3)ID選擇器
#p1 { font-size: 20px; }
#p2 { font-size: 10px; }
id選擇器幫助選擇當(dāng)前頁面中唯一id值的標(biāo)簽,根據(jù)標(biāo)簽的id屬性值進(jìn)行選取設(shè)置樣式,id選擇器的符號是# id值 {屬性:屬性值;}
<p id="p1">段落1設(shè)置20px</p>
<p id="p2">段落2設(shè)置10px</p>
id選擇器命名規(guī)范:字母開頭、下劃線、數(shù)字;不能出現(xiàn)標(biāo)簽名