(一)在html中使用css樣式的方式一般有三種:
1 內聯引用
2 內部引用
3 外部引用。
第一種:內聯引用(也叫行內引用)
就是把css樣式直接作用在html標籤中。
使用css內聯引用表現段落.
特點:內聯的樣式比其他方法更加靈活,但需要和展示的內容混淆在一起,內聯樣式會失去一些樣式表的優點。
第二種:內部引用(也叫內嵌式)
使用style標籤直接把css檔案中的內容載入到html文件內部的
特點 : 適合用於乙個html文件具有獨一無二的樣式時。
第三種:外部引用
外部引用相對於內部引用和內聯引用來說是高效的是節省寬頻的.
外部引用是w3c推薦使用的
實現外部引用有兩種方式:
(1)使用link標籤引用css
(2)使用@import匯入css
注 : 如果在同乙個選擇器上使用幾個不同的樣式表時,這個屬性值將會疊加幾個樣式表,遇到衝突的地方會以最後定義的為準。
(二)css選擇器有六種選擇符:
1 html選擇符
2 類選擇符
3 id選擇符
4 關聯選擇符
5 組合選擇符
6 偽元素選擇符
1 html選擇符 : 即是html標籤,用來改變乙個指定標籤的樣式,任何html元素都可以是乙個css的選擇符。
語法:html標籤名
p /*當中的選擇符是p*/
h1 /*當中的選擇符是h1*/
2 類選擇符 : 匹配文件中元素e的class屬性的屬性值為classname的元素
語法:標記名.類名 或 .類名
類選擇符名稱的定義方式是,"."符號,英文"dot",後加類名稱classname
類選擇符的定義需要有.符號(.符號標明是類選擇符),但是html文件中的標籤的class屬性名不能出現.符號,見下面示例:
p.dark-row /*設定p標籤中class屬性為dark-row的*/
.note /*為note的類可以被用於任何元素*/
第一段第二段
第三段第四段
3 id選擇符 : 匹配文件中元素e的id屬性的屬性值為idname的元素
語法:id名稱
id選擇符名稱的定義方式是,#符號,英文"pound",後加id名稱idname
id選擇符的定義需要有#符號(#符號標明是id選擇符),但是html文件中的標籤的id屬性名不能出現#符號,見下面示例
id屬性的特殊之處在於,乙個文件中只能有乙個元素使用乙個id選擇符(與class屬性正好相反),id屬性可以用來單一地標識乙個元素 。
#main /*id名稱main前加上乙個#號*/
文字縮排3em
4 關聯選擇符 : 也稱包含選擇符,可以單獨對某種元素包含關係定義的樣式表,元素1裡包含元素2,這種方式只對在元素1裡的元素2定義,對單獨的元素1或元素2無定義
語法:選擇符1 選擇符2...
table a
在**內的鏈結改變了樣式,文字大小為12象素,而**外的鏈結的文字仍為預設大小。
5 組合選擇符:也叫選擇符組,可以把相同屬性和值的選擇符組合起來書寫,用逗號將選擇符分開,這樣可以減少樣式重複定義。
語法:選擇符1,選擇符2,.,..
h1, h2, h3, h4, h5, h6
p, table
效果完全等效於:
p table
6 偽元素選擇符是指對同乙個html元素不同狀態的一種定義方式。例如對於標籤的正常狀態、訪問狀態、選中狀態、游標移到超連結文字上的狀態,就可以使用偽元素選擇器來定義。
語法:標籤:偽元素
a:link /* 未訪問的鏈結 */
a:visited /* 已訪問的鏈結 */
a:hover /* 滑鼠在鏈結上 */
a:active /* 啟用鏈結 */
最近整理的所學的淺顯知識,若有錯誤,敬請指正.
css檔案鏈結html的三種方式
html view plain copy 在code上檢視 片派生到我的 片 html view plain copy 在code上檢視 片派生到我的 片 html view plain copy 在code上檢視 片派生到我的 片 鏈入外部csstitle type text css rel st...
html裡嵌入CSS的三種方式
在html中定義css的方式有 embedding 嵌入式 linking 引用式 inline 內聯式 下面通過例項為大家詳細介紹下它們的特點 在html中常用以下3種方式定義css embedding 嵌入式 linking 引用式 inline 內聯式 一 嵌入式 使用html的style元素...
CSS在HTML中使用的三種方式
css在html中使用的三種方式 1.外部樣式表 test.css 此處省略css 部分使用 或是 2.內部樣式表的使用 3.行內樣式表中使用 下面說說css樣式的優先順序 一般情況下 內聯樣式 inline style 內部樣式 internal style sheet 外部樣式 external...