一、樣式表分三類:
1.內聯樣式表。——放在元素的開始標記中。——只對當前元素起作用。
例:
結果:2.內嵌樣式表。——放在頁面的中間。——可以對整個頁面。
你好執行結果:
3.外部樣式表。——放在乙個單獨的.css樣式表檔案中。——可以對整個**。
操作:新建乙個css檔案,用來存放樣式表——>在html中呼叫樣式表,要在html中右鍵——>css樣式表——>附加樣式表。樣式表一般用link連線方式。
(1)外部樣式表的定義
@charset "utf-8";(2)外部樣式表的呼叫/* css document */
input
你好執行結果:
二、樣式表的選擇器:
內嵌、外部樣式表的一般語法:
選擇器{
樣式=值;
樣式=值;
樣式=值;
....
}以下面html為例,了解區分一下各種樣式選擇器。
你好你好1.基本:
(1)標籤選擇器:用標記名稱來當選擇器。
input div span td都可以做標籤選擇器。標籤選擇器控制的是一類,範圍大。
例:
@charset "utf-8";執行結果:/* css document */
input
(2)類別選擇器:在html元素中使用class對元素進行分類,然後使用這個class的值作為選擇器。
.class的名 類別選擇器是想改變誰就單獨改變誰,相對於標籤選擇器要更精確。
選擇器:
@charset "utf-8";html表的呼叫為:/* css document */
.uu
你好你好執行結果:
(3)id選擇器:針對htlm中相應id的元素起作用。
#id的名
選擇器:
@charset "utf-8";執行結果:/* css document */
#a3
2.復合:
(1)用逗號隔開。——並列關係,同時起作用。
input,#dd,.yellow,.uu(2)用空格隔開。——後代關係。
.uu
div .uu不管是子代還是孫子代都是後代,只要在div的後代中有uu的就變化。
執行結果:
(3)class二次篩選。
標籤選擇器.class選擇器
input.uu
例:
.uu執行結果 :div.uu
div.uu的意思是:div存在的同時.uu也存在,屬於二次篩選。
*對比:div .uu與div.uu的不同。
div空格.uu的意思是:div的後代中(不管是子代還是孫子代中)出現.uu,出現的項就會隨樣式表變化。
div.uu的意思是:div存在的同時.uu也存在時,才會隨樣式表變化,屬於二次篩選。
CSS樣式表基礎知識 樣式表的分類及選擇器
一 css基本概念 css cascading style sheet,疊層樣式表 作用是美化html網頁。注釋區域 此為注釋語法 二 樣式表的分類 1 內聯樣式表 和html聯合顯示,控制精確,但是可重用性差,冗餘多 例 內聯樣式表 以上就是乙個簡單的內聯樣式表,用在中的標籤中,相當於style附...
CSS樣式表與選擇器
html解題思路 1 先大致寫出html框架,即定義內容部分。2 然後根據需要寫對應的css樣式,即定義表現部分。3 根據需要可將css檔案定義在外部,用鏈結樣式表或匯入樣式表將外部css檔案引入到當前頁面,實現了表現與內容的分離。css樣式選擇器分類 1 標籤選擇器。2 類選擇器。3 id選擇器。...
CSS 樣式表與選擇器
3,樣式表特點 4,選擇器分類 4 群組選擇器 為一組元素統一設定樣式 5 後代選擇器 空格表示後代 在選擇器 中查詢所有滿足選擇器 的元素 6 子代選擇器 匹配滿足選擇器的所有直接子元素 7 偽類選擇器 為元素的不同狀態分別設定樣式,5,選擇器的優先順序 借助於style標籤屬性,書寫樣式宣告 樣...