認(rèn)識CSS(2)

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)簽名

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • CSS基礎(chǔ) 本文包括CSS基礎(chǔ)知識選擇器(重要?。。。├^承、特殊性、層疊、重要性CSS格式化排版單位和值盒模型浮動...
    廖少少閱讀 3,428評論 0 40
  • 轉(zhuǎn)載請聲明 原文鏈接地址 關(guān)注公眾號獲取更多資訊 第一部分 HTML 第一章 職業(yè)規(guī)劃和前景 職業(yè)方向規(guī)劃定位...
    前端進(jìn)階之旅閱讀 16,866評論 32 459
  • 第6章 開始學(xué)習(xí)CSS,為網(wǎng)頁添加樣式 1、認(rèn)識CSS樣式CSS全稱為“層疊樣式表 (Cascading Styl...
    夏沫xx閱讀 1,111評論 1 11
  • 本課來自http://www.imooc.com/learn/9請不要用作商業(yè)用途。 HTML5 HTML介紹 H...
    PYLON閱讀 3,447評論 0 5
  • 學(xué)習(xí)CSS的最佳網(wǎng)站沒有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_閱讀 1,181評論 0 1

友情鏈接更多精彩內(nèi)容