css:before和:after
2020/11/9 8:51:07 閱讀：8675
發(fā)布者：8675
:before是css中的一種偽元素，可用于在某個元素之前插入某些內(nèi)容。
:after是css中的一種偽元素，可用于在某個元素之后插入某些內(nèi)容。
<style>
p:before{
content: "H" /*:before和:after必帶技能，重要性為滿5顆星*/
}
p:after{
content: "d" /*:before和:after必帶技能，重要性為滿5顆星*/
}
</style>
<p>ello Worl</p>
以上的代碼將會在頁面中展現(xiàn)的是"Hello World"
p標(biāo)簽內(nèi)部的內(nèi)容的前面會被插入一個:before偽元素，該偽元素內(nèi)包含的內(nèi)容是"H"；而在p標(biāo)簽內(nèi)的內(nèi)容后面會被插入一個:after偽元素，該元素包含的內(nèi)容是"d"。
清除浮動 場景:當(dāng)一個元素在眾多設(shè)置了浮動樣式float: left的后面，但是又要另起一行時;建議:強烈推薦;代碼:.container::before { content: ""; display: table; } .container::after { clear: both; }
利用::before ::after偽類，動態(tài)的在元素開始和末尾增加標(biāo)簽這一特性，我們可以做出很多豐富的樣式而且又減少了 DOM 的復(fù)雜度。
