使用過的CSS元素整理 選擇器

2021-07-02 07:37:42 字數 1305 閱讀 7620

tips:在css中有同名規則會產生覆蓋,具體度越高,限定越精確的優先權越高。

標籤選擇器;使用p{} ;

類名選擇器 ;  使用 .name{};

id 選擇器    ;  使用#id {};

1. 復合選擇器

div,p     選擇所有元素和所有元素。

2.層次選擇器

divp     選擇元素內部的所有元素。

3.多類選擇器:

乙個 class 值中可能包含乙個詞列表,各個詞之間用空格分隔。

this paragraph is a very important warning.

.important.warning  ;

4.偽類選擇器:

1):hover:選擇滑鼠指標浮動在其上的元素,並設定其樣式.

2):focus:選擇獲得焦點的input 元素。

div>p   選擇父元素為div元素的所有p元素。

注釋:如果元素不是父元素的直接子元素,則不會被選擇。​即只有第一層元素會被選擇。

我是唐老鴨。

我住在 duckburg。

我最好的朋友是公尺老鼠。

我的樣式不會改變。

在每個p元素的內容之前/之後插入內容。

5):not(selector)

:not(p)      選擇非p元素的每個元素。

li:not(p)   它表示不包括p元素的li元素..

6)and so on.

CSS選擇器整理

1 常用選擇器 a 元素選擇器 簡單選擇器 型別選擇器 匹配特定標籤的元素,格式為 標籤 例如 p h1b 後代選擇器 匹配特定元素或者元素組的後代,格式為 標籤 後代,例如 div p ul lic id選擇器 匹配特定id的元素,格式為 id,例如 information blogd 類選擇器 ...

CSS 元素選擇器

最常見的 css 選擇器是元素選擇器。換句話說,文件的元素就是最基本的選擇器。如果設定 html 的樣式,選擇器通常將是某個 html 元素,比如 p h1 em a,甚至可以是 html 本身 html h1 h2親自試一試 可以將某個樣式從乙個元素切換到另乙個元素。假設您決定將上面的段落文字 而...

css 元素選擇器

子元素選擇器 h1 strong 這個規則會把第乙個 h1 下面的兩個 strong 元素變為紅色,但是第二個 h1 中的 strong 不受影響 後代選擇器 descendant selector 又稱為包含選擇器 h1 em 上面這個規則會把作為 h1 元素後代的 em 元素的文字變為 紅色。其...