新聞中心

創(chuàng)新互聯(lián)公司堅持“要么做到,要么別承諾”的工作理念,服務(wù)領(lǐng)域包括:成都網(wǎng)站建設(shè)、成都網(wǎng)站設(shè)計、企業(yè)官網(wǎng)、英文網(wǎng)站、手機端網(wǎng)站、網(wǎng)站推廣等服務(wù),滿足客戶于互聯(lián)網(wǎng)時代的安康網(wǎng)站設(shè)計、移動媒體設(shè)計的需求,幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴!
CSS 中提供了一個 opacity 屬性用來設(shè)置元素的透明度,它不僅對顏色有效,對圖像或者頁面中其它的元素也有效。其語法格式如下:
opacity: number;
其中 number 為一個 0~1 之間的浮點數(shù)(小數(shù)),用來表示元素的透明度,值越小則越透明(0 表示完全透明,1 表示完全不透明)。
另外,在使用 opacity 屬性時,還需要注意以下幾點:
- 當(dāng)一個元素定義了 opacity 屬性,并且其值小于 1 時,那么它的子元素也會擁有同樣的透明度;
- 當(dāng)一個元素定義了 opacity 屬性,并且其值小于 1 時,將會重新定義該元素默認的 z-index 屬性,如果其它的元素為非定位元素,那么該元素的堆疊級別將會高于其它元素;
- 如果定義的 opacity 屬性值超過了指定的范圍,那么則截取與之最相近的值,例如 1.5 將截取為 1。
【示例】使用 opacity 屬性設(shè)置元素的透明度:
運行結(jié)果如下圖所示:
圖:opacity 屬性演示
IE8 或者更早版本的 IE 瀏覽器不支持 opacity 屬性,若想要在這些瀏覽器中實現(xiàn)透明效果可以使用 filter 屬性,語法格式如下:
filter: alpha(opacity = number);
其中 number 的取值范圍為 0~100,值越小則越透明。
【示例】使用 filter 屬性設(shè)置元素的透明度:
運行結(jié)果如下圖所示:
圖:filter: alpha(opacity=x) 屬性演示
為了讓所有瀏覽器都可以實現(xiàn)透明效果,您可以同時定義 opacity 和 filter 兩個屬性,如下所示:
p {
opacity: 0.5;
filter: alpha(opacity=50);
}
當(dāng)前標題:CSS透明度(opacity)
轉(zhuǎn)載來源:http://m.fisionsoft.com.cn/article/dpdsdod.html


咨詢
建站咨詢
