css之偽元素

其他w3school文件

css 偽元素用於向某些選擇器設定特殊效果。

可以通過這個屬性設定文字第一行的特殊效果，比如一段文字的第一行為紅色，其他為黑色。

如果不通過這個方式來實現，就比較麻煩。因為螢幕適配的原因，你可能不能確定哪些文字屬於第一行

和first-line 相似，這個只是設定第乙個字元的特殊效果。比如第乙個字的字型比別的大

如果不通過這個方式實現，那麼就可能還要處理對齊，這種實現方式更方便

這個看效果是向指定元素前後追加內容，比如：

演示偽元素

很明顯，是向tx元素前後追加了內容

官方的例子，通過設定content屬性，追加了：

但是這種實現效果，為什麼不使用兩個元素來做呢？為什麼要使用偽元素設定content呢。也只是為了不處理對齊這樣的嗎？

提到有一點，js是無法控制偽元素的

偽元素也不利於除錯

乙個個人覺得比較有說服力的參考3

用於元素的前後修飾

也就是說，當元素前後有一些比較簡單的修飾的時候，我們可以使用偽元素使得我們的**更簡潔

用於元素的狀態切換效果

狀態切換效果應該是需要配合偽類實現的

CSS之偽元素

之前做乙個需求的時候需要對頁面上所有的banner上新增提示文案，例如 這是廣告。本來想乙個乙個廣告部件上新增文案div來實現。後面向同組大佬請教，可以利用css中的偽元素 before來實現。偽元素，顧名思義，就是它們不是真的html頁面元素，實際上就乙個帶有css樣式的透明元素，只展示某些css...

css偽類，偽元素

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

CSS偽類 偽元素

css偽類用於向某些選擇器新增特殊的效果。錨偽類a link 未訪問的鏈結 a visited 已訪問的鏈結 a hover 滑鼠移動到鏈結上 a active 選定的鏈結 注意 1 在 css 定義中，a hover 必須被置於 a link 和 a visited 之後，才是有效的。2 在 cs...