十年網(wǎng)站開發(fā)經(jīng)驗(yàn) + 多家企業(yè)客戶 + 靠譜的建站團(tuán)隊(duì)
量身定制 + 運(yùn)營維護(hù)+專業(yè)推廣+無憂售后,網(wǎng)站問題一站解決
小編給大家分享一下css中after有什么用,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
css after是CSS中的一種選擇器,該選擇器可用于在被選元素的內(nèi)容后面插入內(nèi)容,其語法如“p:after{ content:"";background-color:yellow;color:red;}”。
在CSS中,:after偽類的作用就是在指定的元素內(nèi)容(而不是元素本身)之后插入一個(gè)包含content屬性指定內(nèi)容的行內(nèi)元素。
最基本的用法如下:
我是唐老鴨。
我住在 Duckburg。
after偽類的一些應(yīng)用
:after清除浮動(dòng)
浮動(dòng)布局導(dǎo)致高度坍塌影響到整體布局時(shí)元素需要清除浮動(dòng),使用:after就是其中的一種方法:
.row:after { width:0; height:0; content:''; display: block; clear: both; }
偽類和偽元素
偽類選擇元素基于的是當(dāng)前元素處于的狀態(tài),或者說元素當(dāng)前所具有的特性,而不是元素的id、class、屬性等靜態(tài)的標(biāo)志。由于狀態(tài)是動(dòng)態(tài)變化的,所以一個(gè)元素達(dá)到一個(gè)特定狀態(tài)時(shí),它可能得到一個(gè)偽類的樣式;當(dāng)狀態(tài)改變時(shí),它又會(huì)失去這個(gè)樣式。由此可以看出,它的功能和class有些類似,但它是基于文檔之外的抽象,所以叫偽類。
與偽類針對(duì)特殊狀態(tài)的元素不同的是,偽元素是對(duì)元素中的特定內(nèi)容進(jìn)行操作,它所操作的層次比偽類更深了一層,也因此它的動(dòng)態(tài)性比偽類要低得多。實(shí)際上,設(shè)計(jì)偽元素的目的就是去選取諸如元素內(nèi)容第一個(gè)字(母)、第一行,選取某些內(nèi)容前面或后面這種普通的選擇器無法完成的工作。它控制的內(nèi)容實(shí)際上和元素是相同的,但是它本身只是基于元素的抽象,并不存在于文檔中,所以叫偽元素。
以上是“css中after有什么用”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對(duì)大家有所幫助,如果還想學(xué)習(xí)更多知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!