CSS中有時(shí)候我們會(huì)想要讓背景透明，但是字體卻不透明。這在設(shè)計(jì)中非常常見，因?yàn)樗梢詭椭覀儗⒔裹c(diǎn)放在內(nèi)容上，同時(shí)又不會(huì)過于顯眼。那么，要如何實(shí)現(xiàn)這個(gè)效果呢？

.transparent-background {
background-color: rgba(255, 255, 255, 0.5);
/* 這里rgba中的最后一個(gè)值就是用來(lái)控制透明度的，0表示完全透明，1表示完全不透明 */
padding: 10px;
}
.opaque-text {
color: #000000;
/* 這里是正常不透明字體的顏色 */
opacity: 1;
/* 控制不透明度的值，從0到1 */
}

以上代碼實(shí)現(xiàn)了背景透明、字體不透明的效果。我們可以在外層元素中設(shè)置背景顏色，并使用rgba函數(shù)來(lái)控制透明度。內(nèi)層元素中使用opacity屬性來(lái)設(shè)定字體不透明度的值。由于opacity是屬于CSS3的新屬性，所以在低版本的瀏覽器中可能不支持。但是，我們可以使用IE的filter屬性來(lái)模擬opacity的效果：

.opaque-text {
color: #000000;
filter: alpha(opacity=100);
}

同樣，filter屬性的參數(shù)也是0到100，數(shù)值越高就越不透明。但是需要注意的是，filter屬性只對(duì)IE瀏覽器有效。