CSS3的偽物件選擇器

2021-07-27 09:37:29 字數 592 閱讀 3014

在學習css3的過程中,我們會遇到偽物件這個名詞,顧名思義偽物件不是真正的物件,但它和物件所表示的意思又十分相似。

經常會遇到的偽物件選擇器主要有以下幾個:

1 .:before  選擇器在被選元素的內容前面插入內容。

2. :after  選擇器在被選元素的內容

後面插入內容。

下面我們是想在下面的div的前面和後面分別追加內容。 a

此時css**為:

.content:before {

content: 'a';

color: #f40;

.content:after {

content: 'c';

color: #f40;

執行結果為

在使用偽物件選擇器的時候,我們要注意一點before 

和after

必須和content

結合使用,即使沒有內容插入也要寫

content=' '。

偽物件選擇器在樣式的編寫中使用很多,這一點大家要知道的。

CSS3 選擇器 偽類選擇器

e pseudo class e.class pseudo class 語法1示例 a link 語法2示例 a selected hover 動態偽類,因為這些偽類並不存在於html中,而只有當使用者和 互動的時候才能體現出來,動態偽類包含兩種。第一種是我們在鏈結中常看到的錨點偽類,如 link ...

Css3選擇器 偽類選擇器

一 動態偽類 動態偽類,因為這些偽類並不存在於html中,而只有當使用者和 互動的時候才能體現出來,動態偽類包含兩種,第一種是我們在鏈結中常看到的錨點偽類,如 link visited 另外一種被稱作使用者行為偽類,如 hover active 和 focus 對於 hover在ie6下只有a元素支...

CSS3偽元素選擇器

css3偽元素選擇器 css3偽元素選擇器有兩種 分別是 before和 after,下面我們分別進行介紹 先介紹一下使用的注意事項 1.他們本身就是乙個元素 盒子 使用的時候相當於是在原先的div所建立的盒子裡增加新的 小盒子 可以定義其屬性但是預設的只是行內元素。2.before和after所代...