CSS偽元素 偽元素消除浮動 偽類

2021-08-28 06:57:02 字數 1348 閱讀 6501

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

1、:first-line 偽元素

"first-line" 偽元素用於向文字的首行設定特殊樣式。

p:first-line

注釋:"first-line" 偽元素只能用於塊級元素。

注釋:下面的屬性可應用於 "first-line" 偽元素:值描述

none

預設。定義標準的文字。

underline

定義文字下的一條線。

overline

定義文字上的一條線。

line-through

定義穿過文字下的一條線。

blink

定義閃爍的文字。

inherit

規定應該從父元素繼承 text-decoration 屬性的值。

2、:first-letter 偽元素

"first-letter" 偽元素用於向文字的首字母設定特殊樣式

注釋:"first-letter" 偽元素只能用於塊級元素。

注釋:下面的屬性可應用於 "first-letter" 偽元素:

3、css2 - :before 偽元素

":before" 偽元素可以在元素的內容前面插入新內容。

下面的例子在每個 元素前面插入一幅:

h1:before

4、css2 - :after 偽元素

":after" 偽元素可以在元素的內容之後插入新內容。

下面的例子在每個 元素後面插入一幅:

h1:after

二、偽元素消除浮動

有這樣一種情形:在乙個容器(container)中,有兩個浮動的子元素。

css語句中有乙個:after偽選擇符,就可以在父容器的尾部自動建立乙個子元素。

.clearfix:after

.clearfix

三、偽類

a:link 		/* 未訪問的鏈結 */

a:visited /* 已訪問的鏈結 */

a:hover /* 滑鼠移動到鏈結上 */

a:active /* 選定的鏈結 */

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...

CSS 偽元素 偽類

link 未訪問的鏈結 visited 已訪問的鏈結 hover 滑鼠移到元素上 active 向被啟用的鏈結新增樣式 focus 獲得輸入焦點的元素 first child 作為某元素的第乙個子元素的元素 lang 向帶有指定lang屬性的元素新增樣式 在 css 定義中,a hover 必須被置...