站在CSS3的肩上定義選擇器

2022-06-25 06:48:11 字數 923 閱讀 3675

.architect > p

/*這個選擇器僅僅選擇architect類元素的子元素(而非子子元素,子子子元素等)的p元素。包含於任何其他元素的p元素均不會被選擇*/

...

/* 相鄰同胞元素是直接相互毗鄰的元素,即他們之劍沒有其他的同胞元素

*/

.architect  p+p    

/*相鄰同胞結合符只選擇直接跟在同胞p元素之後的元素*/

/*  普通同胞元素結合符:可以選擇那些並非直接出現在另乙個同胞元素後面的同胞元素。它與相鄰同胞結合符的唯一區別是使用~(波浪號)代替 +(加號)。例如,h1~h2會讓任何屬於同一父元素的同胞h1後面的h2元素顯示為紅色(它們可以直接相鄰,也可以不直接相鄰)

*/

:first-child 選擇第乙個子元素

:last-child 選擇最後乙個子元素

:first-letter 選擇元素的第乙個字母

:first-line 選擇元素的第一行

幾個常用的偽類

:focus 獲取滑鼠焦點的樣式

a:[attribute] 匹配具有指定屬性attribute,無論具體值是什麼的a標籤

a: [attribute="value"] 匹配指定屬性值的a標籤

a:[attribute~="value"] 屬性值是以空格分隔的多個單詞,其中有乙個完全匹配指定值

a:[attribute|="value"] 屬性值以value-打頭

a:[attribute^="value"] 屬性值以value開頭,value為完整的單詞或單詞的一部分

a:[attribute$="value"] 屬性值以value結尾,value為完整的單詞或單詞的一部分

a:[attribute*="value"] 屬性值為指定值的子字串

css3 定義選擇器

引言 css樣式規則有兩個主要部分。選擇器決定將格式化應用到哪些元素。宣告則定義要應用的格式化。選擇器可以定義五個不同的標準來選擇要進行格式化的元素。元素的型別或者名稱。如下所示。h1 元素所在的上下文。如下所示。h1 em 元素的類或id。如下所示。類選擇器 error id 選擇器 gaudi ...

css3 選擇器 CSS3選擇器

子級選擇器用於選取帶有特定父元素的元素。書寫語法 element1 element2 注意 如果 element2 元素不是父元素 element1 的直接子元素,則不會被選擇。符號之前書寫父級的選擇器,符號之後寫子級選擇器,必須滿足父子級關係才選中標籤 相鄰兄弟選擇器可以用於選擇緊接在另乙個元素後...

css3 選擇器 CSS3選擇器詳解

css3在css2基礎上,增強或新增了許多特性,彌補了css2的眾多不足之處,使得web開發變得更為高效和便捷。比如說,同樣是乙個頭像,可能在低版本的瀏覽器中,頭像方的 在高版本的瀏覽器中,頭像是圓的。漸進增強和優雅降級之間的不同 面試題目 由於css3普遍存在相容性問題,為了避免因相容性帶來的干擾...