CSS的偽元素和偽類

2022-02-19 02:28:07 字數 481 閱讀 9605

css3為了區分偽類和偽元素,偽元素採用雙冒號寫法。

常見偽類—— :hover, :active, :visited, :focus。

常見偽元素——::first-letter,::first-line,::before,::after,::selection。

::before和::after下特有的content,用於在css渲染中向元素邏輯上的頭部或尾部新增內容(可以是文字,圖示等,下圖就是乙個正方形圖示,圖示是通過css繪製的)。

這些新增不會出現在dom中,不會改變文件內容,不可複製,僅僅是在css渲染層加入。但是在開發者工具模式下可以看到形如「::before」字段。

所以不要用:before或:after展示有實際意義的內容,盡量使用它們顯示修飾性內容,例如圖示

參考:1、

2、

css偽類和偽元素

css偽類用於向某些選擇器新增特殊的效果。link,visited,hover,focus,active,first child,lang css3新增的偽類 last child,only child,first of type,last of type,only of type,nth chil...

CSS偽類和偽元素

css引入偽類和偽元素概念是為了格式化文件樹以外的資訊。也就是說,偽類和偽元素是用來修飾不在文件樹中的部分,比如,一句話中的第乙個字母,或是列表中的第乙個元素,又或者是滑鼠懸停在某個超連結上時要設定的樣式。常見的狀態偽類主要包括 link 應用於未被訪問過的鏈結 hover 應用於滑鼠懸停到的元素 ...

css偽類,偽元素

偽類作用於整個元素,比如 a link a hover div first child 儘管這些條件都不是基於dom的,但結果沒乙個都是作用於乙個完整的元素,比如整個鏈結,段落,div等等 偽元素作用於元素一部分,比如 p first line p first letter 偽元素作用於元素的一部分...