CSS樣式表與選擇器

2021-08-26 09:58:54 字數 1183 閱讀 4010

html解題思路: (1)先大致寫出html框架,即定義內容部分。 (2)然後根據需要寫對應的css樣式,即定義表現部分。 (3)根據需要可將css檔案定義在外部,用鏈結樣式表或匯入樣式表將外部css檔案引入到當前頁面,實現了表現與內容的分離。 css樣式選擇器分類: (1)標籤選擇器。 (2)類選擇器。 (3)id選擇器。 (4)偽類選擇器。 (5)包含選擇器。 (6)組合選擇器。 樣式表與選擇器用法注意事項: 1)標籤選擇器一般用於某個頁面中具有相同型別的標籤上。如: p則在此頁面中的所有p標籤的文字顏色都被設為 紅色。 2)標籤選擇器具有同一性,而不具有特定性,若想對同一型別 的某個或若干個標籤設定另一種樣式,則可用類選擇器幫你。 如:.blue在html中引用此類的標籤的文字顏色 將被設為藍色。 如: 我愛css

我愛css

我愛css

我愛css

而對應的樣式表內容為: p .blue 則第三四個p標籤的文字將被設為藍色。 3)若只想對某個標籤設定一種樣式,則可用id選擇器辦到這點。 如: 如: 我愛css

我愛css

我愛css

我愛css

我愛css

而對應的樣式表內容為: p .blue #orange 則第五個標籤的顏色為桔色。只對id為"orange"的標籤起作用,這就是id選擇器。 4)包含選擇器的作用主要是為了提高樣式表的優先順序,另外,也方便引用某個標籤的子標籤 對其設樣式。 如: 我愛css

我愛css

我愛css 我愛css

而對應的樣式表內容為: .orange 若只設定這條,說明上述所有p標籤的文字顏色將被設成桔色。若只想對最後乙個p 標籤內的span標記設樣式,可以加上一樣式規則 。 .orange span 這樣span標籤內的文字將被設為紅色。span標籤是p標籤的子標籤,所以這種選擇器又叫做後代選擇器。 5)組合選擇器主要是為了方便對多個標籤元素設定樣式。 如: 我愛css

我愛css

我愛css我愛css而對應的樣式表內容為: p,span,b 通過這條樣式規則可將上述三種標籤的文字顏色設為紅色。 6) 偽類選擇器在css1中主要是用定義鏈結在不同狀態下的樣式效果, 包括活動狀態、已被訪問狀態、未被訪問狀態及滑鼠懸停狀態等。 如: a:hover 表示當滑鼠移動鏈結上時會自動去掉下劃線。 7)選擇器的優先順序: id選擇器》類選擇器》標籤選擇器 8)另外樣式表的優先順序: 行內樣式表》嵌入樣式表》外部樣式表 外部樣式表分為兩類: 鏈結樣式表: 如: 匯入樣式表: 如:

CSS 樣式表與選擇器

3,樣式表特點 4,選擇器分類 4 群組選擇器 為一組元素統一設定樣式 5 後代選擇器 空格表示後代 在選擇器 中查詢所有滿足選擇器 的元素 6 子代選擇器 匹配滿足選擇器的所有直接子元素 7 偽類選擇器 為元素的不同狀態分別設定樣式,5,選擇器的優先順序 借助於style標籤屬性,書寫樣式宣告 樣...

css樣式表 樣式表分類 選擇器

一 樣式表分三類 1.內聯樣式表。放在元素的開始標記中。只對當前元素起作用。例 結果 2.內嵌樣式表。放在頁面的中間。可以對整個頁面。你好 執行結果 3.外部樣式表。放在乙個單獨的.css樣式表檔案中。可以對整個 操作 新建乙個css檔案,用來存放樣式表 在html中呼叫樣式表,要在html中右鍵 ...

樣式表與選擇器

樣式表的分類 內聯樣式表 樣式寫在標籤裡 重用性差,但控制精確 內嵌樣式表 嵌在網頁的某個位置 重用性高一些,控制性不如內聯精確 外部樣式表 樣式是寫在乙個外部檔案裡面 重用性最高,控制精確度最低 文字 通過選擇器找元素 id 每個元素都可以加,id不能重複,以字母開頭 class 類名,每個元素都...