html標籤選擇器的使用選擇(學習小記)

2021-06-17 01:13:59 字數 957 閱讀 3666

css選擇器包括:標記選擇

器,類別選擇器(.class),id選擇器(#id)三種。

1.標籤選擇器:如:p td tr h1 h2 span a

標籤選擇器,是所有帶有某種標籤的都生效。這裡以p為例,也就是所有的帶有p標記的都會這樣的樣式

css**:

phtml**:

>我是標籤小紅》

2.類別選擇器:如:#main #sidebar #footer #header

注意id選擇器是唯一的,因為只有id="yy"的才有這種樣式,而乙個頁面裡元素的id必須是唯一的,id選擇器以#開頭用法是:id=""

css**:

#testid

html**:

="testid"

>我是id小紅》

3.id 選擇器:如:.post .content .widget

類選擇器以.開頭    只要把元素的class="" 就能表現為這種樣式了用法是:class=""

css**:

#testid

html**:

="testid"

>我是id小紅》

4.各選擇器的使用選擇

在實際使用中,單一的元素或需要程式、js控制的東西,需要用id定義;重複使用的元素、類別,用class定義。

--確定使用類選擇符還是id選擇符的一般規則

(1)對於網頁結構問題,應該使用id選擇符

(2)對於重複出現的樣式,可以使用類選擇符

(3)當id選擇符和類選擇符衝突時,id選擇符的優先順序大於類選擇符

(4)也可以為id選擇符指定標籤範圍,這樣可以提高樣式的優先順序。

上面三種選擇器都作用與同乙個標籤的話,因為標籤選擇器範圍最大,然後是class選擇器次之,

id選擇器最小,所以,以作用範圍小的為準!!!

標籤 選擇器

選擇標籤,除了大家眾說周知的 id class name 外,還可以 屬性選擇器 a class icon 選擇匹配a 元素,並且 a 元素的class 是以icon 開頭的,class 可以換成任意屬性 a href pdf 選擇匹配a 元素,並且 a 元素的href 是以pdf 結尾的,href...

標籤選擇器

標籤選擇器其實就是html 中的標籤。如右側 編輯器中的 例如下面 p上面的css樣式 的作用 為p標籤設定12px字型大小,行間距設定1.6em的樣式。示例 doctype html 標籤選擇器 title style type text css h1style head body h1 勇氣 h...

HTML常用標籤及選擇器

html基本標籤 補充內容 標籤分為雙標籤和單標籤,雙標籤例如 單標籤例如 標籤名 標籤備註 標題標籤 h1 h6 文字大小依次減小 塊級標籤 段落標籤 p塊級標籤 換行標籤 br塊級標籤 水平線標籤 hr塊級標籤 div標籤 div塊級標籤 span標籤 span 行內標籤 引用標籤 blockq...