|
導讀網頁的本質就是超級文本標記語言，通過結合使用其他的Web技術（如：腳本語言、公共網關接口、組件等），可以創造出功能強大的網頁。因而，超級文本標記語言是萬維網（Web）編程的基礎，也就是說萬維網是建立... 網頁的本質就是超級文本標記語言，通過結合使用其他的Web技術（如：腳本語言、公共網關接口、組件等），可以創造出功能強大的網頁。因而，超級文本標記語言是萬維網（Web）編程的基礎，也就是說萬維網是建立在超文本基礎之上的。超級文本標記語言之所以稱為超文本標記語言，是因為文本中包含了所謂“超級鏈接”點。 本篇文章給大家帶來的內容是介紹css中偽類和偽元素有什么區別？:before和::before的區別。有一定的參考價值，有需要的朋友可以參考一下，希望對你們有所幫助。偽類用于選擇DOM樹之外的信息，或是不能用簡單選擇器進行表示的信息。前者包含那些匹配指定狀態的元素，比如:visited，:active；后者包含那些滿足一定邏輯條件的DOM樹中的元素，比如:first-child，:first-of-type，:target。 （相當于一個特殊的class選擇器，用來添加一些特殊效果） 偽元素為DOM樹沒有定義的虛擬元素。不同于其他選擇器，它不以元素為最小選擇單元，它選擇的是元素指定內容。比如::before表示選擇元素內容的之前內容，也就是""；::selection表示選擇元素被選中的內容。 （相當于一個特殊的元素（p、span），可以用來存放一些特殊樣式或者內容） 在CSS3中，偽類與偽元素在語法上也有所區別，偽元素修改為以::開頭。但因為歷史原因，瀏覽器對以:開頭的偽元素也繼續支持，但建議規范書寫為::開頭。 | :active | 選擇正在被激活的元素 | 1 | | :hover | 選擇被鼠標懸浮著元素 | 1 | | :link | 選擇未被訪問的元素 | 1 | | :visited | 選擇已被訪問的元素 | 1 | | :first-child | 選擇滿足是其父元素的第一個子元素的元素 | 2 | | :lang | 選擇帶有指定 lang 屬性的元素 | 2 | | :focus | 選擇擁有鍵盤輸入焦點的元素 | 2 | | :enable | 選擇每個已啟動的元素 | 3 | | :disable | 選擇每個已禁止的元素 | 3 | | :checked | 選擇每個被選中的元素 | 3 | | :target | 選擇當前的錨點元素 | 3 | | :first-of-type | 選擇滿足是其父元素的第一個某類型子元素的元素 | 3 | | :last-of-type | 選擇滿足是其父元素的最后一個某類型子元素的元素 | 3 | | :only-of-type | 選擇滿足是其父元素的唯一一個某類型子元素的元素 | 3 | | :nth-of-type(n) | 選擇滿足是其父元素的第n個某類型子元素的元素 | 3 | | :nth-last-of-type(n) | 選擇滿足是其父元素的倒數第n個某類型的元素 | 3 | | :only-child | 選擇滿足是其父元素的唯一一個子元素的元素 | 3 | | :last-child | 選擇滿足是其父元素的最后一個元素的元素 | 3 | | :nth-child(n) | 選擇滿足是其父元素的第n個子元素的元素 | 3 | | :nth-last-child(n) | 選擇滿足是其父元素的倒數第n個子元素的元素 | 3 | | :empty | 選擇滿足沒有子元素的元素 | 3 | | :in-range | 選擇滿足值在指定范圍內的元素 | 3 | | :out-of-range | 選擇值不在指定范圍內的元素 | 3 | | :invalid | 選擇滿足值為無效值的元素 | 3 | | :valid | 選擇滿足值為有效值的元素 | 3 | | :not(selector) | 選擇不滿足selector的元素 | 3 | | :optional | 選擇為可選項的表單元素，即沒有“required”屬性 | 3 | | :read-only | 選擇有"readonly"的表單元素 | 3 | | :read-write | 選擇沒有"readonly"的表單元素 | 3 | | :root | 選擇根元素 | 3 |
偽元素 | ::first-letter | 選擇指定元素的第一個單詞 | 1 | | ::first-line | 選擇指定元素的第一行 | 1 | | ::after | 在指定元素的內容前面插入內容 | 2 | | ::before | 在指定元素的內容后面插入內容 | 2 | | ::selection | 選擇指定元素中被用戶選中的內容 | 3 |
:before和::before的區別 二者寫法是等效的，都表示偽元素。 :before是CSS2的寫法，::before是CSS3的寫法。 :before的兼容性比::before兼容性好，但是H5開發中建議使用::before
注意： 偽元素要配合content屬性一起使用 偽元素不會出現在DOM中，所以不能通過js來操作，僅僅是在 CSS 渲染層加入 偽元素的特效通常要使用:hover偽類樣式來激活
.test:hover::before { /* 這時animation和transition才生效 */ }參考地址：https://www.cnblogs.com/ammyben/p/8012747.html https://blog.csdn.net/yangxiaoyanger/article/details/79712180 以上就是css中偽類和偽元素有什么區別？:before和::before的區別的詳細內容，更多請關注php中文網其它相關文章！
網站建設是一個廣義的術語，涵蓋了許多不同的技能和學科中所使用的生產和維護的網站。
| 
