CSS中的content是一項(xiàng)重要的屬性，它能夠讓我們?cè)诰W(wǎng)頁(yè)上加入一些額外的內(nèi)容。content可以用于為元素創(chuàng)建偽元素，也可以用于在元素的before或after偽元素中添加文本內(nèi)容。

.greeting:before{
content: "Hello, ";
}
.greeting:after{
content: "!";
}

上面的代碼片段創(chuàng)建了一個(gè)類(lèi)名為greeting的元素，使用: before和: after偽元素，分別在前面和后面添加了文本內(nèi)容。也可以用content添加一些其他的內(nèi)容，如圖標(biāo)、符號(hào)、數(shù)值等。

.icon:before{
content: "";
display: inline-block;
width: 20px;
height: 20px;
background-image: url("icon.png");
}

這個(gè)例子是給元素加入一個(gè)圖標(biāo)，同樣是利用:before偽元素來(lái)實(shí)現(xiàn)。我們給偽元素設(shè)置一個(gè)空的content，然后設(shè)置其為inline-block，為圖標(biāo)設(shè)置寬高和背景圖片即可。

需要注意的是，content只能用于偽元素中，不能用于普通的元素。同時(shí)，content中也不能使用js變量或計(jì)算屬性，只能包括靜態(tài)的字符串或特定值。

總結(jié)來(lái)說(shuō)，使用content屬性我們可以為網(wǎng)頁(yè)添加些許個(gè)性和創(chuàng)意，讓頁(yè)面更有趣味和可讀性。且令人驚嘆的是，僅用CSS創(chuàng)建的content不僅具有視覺(jué)上的價(jià)值，而且還支持屏幕閱讀器和SEO。