認識CSS(2)

1、css語法

P{color:red}

選擇符:P

聲明:{屬性:值}

括號

換行、空格不敏感

div{color:red;}

P{fontsize:14px;color:blue;}

h1{

? ? ?width:20px;

? ? ?height:200px;

? ? }

2、css設置樣式

案例:

p標簽背景色為紅色

h1標簽字體顏色為綠色

span標簽文本為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; ">我是一個段落標簽</p>

3、css的注釋

單行注釋:/*注釋內(nèi)容*/

多行注釋:

/*


*/

注意:注釋不可嵌套

4、css的選擇器

(1)標簽選擇器

(2)通配符選擇器:*{屬性1:屬性值1;屬性2:屬性值2;} ?其中*代表當前頁面中的所有標簽

通配符的穿透力很強,優(yōu)先級高于繼承的樣式,會覆蓋繼承的樣式,一般不用。

例:通過通配符選擇器定義css樣式,清除所有HTML標記的默認邊距。

*{

margin:0; ? ?/*定義外邊距*/

padding:0; /*定義內(nèi)邊距*/

}

(3)ID選擇器

#p1 { font-size: 20px; }

#p2 { font-size: 10px; }

id選擇器幫助選擇當前頁面中唯一id值的標簽,根據(jù)標簽的id屬性值進行選取設置樣式,id選擇器的符號是# id值 {屬性:屬性值;}

<p id="p1">段落1設置20px</p>

<p id="p2">段落2設置10px</p>

id選擇器命名規(guī)范:字母開頭、下劃線、數(shù)字;不能出現(xiàn)標簽名

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

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

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

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