首頁  >  文章  >  web前端  >  css中偽類及偽物件是什麼意思

css中偽類及偽物件是什麼意思

WBOY
WBOY原創
2022-04-27 18:19:032128瀏覽

在css中,偽類別是定義元素特殊狀態的意思,可以加入一些選擇器的特殊效果,是css內建類別css內部本身賦予的一些特性和功能;偽物件是將特殊的效果加到某些選擇器的意思,效果可以透過添加實際的元素來實現。

css中偽類及偽物件是什麼意思

本教學操作環境:windows10系統、CSS3&&HTML5版本、Dell G3電腦。

css中偽類別及偽物件是什麼意思

偽類別

css偽類別是用來定義元素的特殊狀態

CSS偽類別是用來增加一些選擇器的特殊效果。

解釋:在感覺上偽類別可以是動態的,當使用者和文件互動的時候一個元素可以取得或失去一個偽類別。例外的是":first-child"能透過文檔樹推斷出來,":lang"在某些情況下也在從文檔樹推斷出來。

由此可以看出,它的功能和class有些類似,但它是基於文件之外的抽象,所以叫偽類。 [1] 

偽類別有::first-child ,:link:,vistited,:hover:,:active,:focus,:lang,:right,:left,:first

何為偽類?就是css內建類別css內部本身賦予它一些特性和功能,也就是你不用再class=...或id=...你就可以直接拿來使用,當然你也可以改變它的部分屬性例如:a:link{color:#FF0000;}

CSS很多的建議並沒有得到瀏覽器的支持,但有四個可以安全用在超連結上的偽類別。

偽類別的語法:

selector:pseudo-class {
  property: value;
}

偽物件

#偽元素:用於將特殊的效果新增至某些選擇器

css偽元素代表了某個元素的子元素,這個子元素雖然在邏輯上存在,但卻不實際存在於文檔樹中。

偽元素用於建立一些不在文件樹中的元素,並為其添加樣式。實際上,偽元素就是選取某些元素前面或後面這種普通選擇器無法完成的工作。控制的內容和元素是相同的,但它本身是基於元素的抽象,並不存在於文件結構中。比如說,我們可以透過:before來在一個元素前面增加一些文本,並為這些文本添加樣式。

偽元素的語法:

selector::pseudo-element{property:value;}
标签:伪元素{性质:值;}

CSS類別也可以與偽元素配合使用:

selector.class::pseudo-element{property:value;}
标签类:伪元素{性质:值;}

(學習影片分享:css影片教學

以上是css中偽類及偽物件是什麼意思的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn