溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

css如何設(shè)置元素透明度

發(fā)布時(shí)間：2021-07-16 11:46:00 來(lái)源：億速云 閱讀：178 作者：chen 欄目：web開(kāi)發(fā)

本篇內(nèi)容主要講解“css如何設(shè)置元素透明度”，感興趣的朋友不妨來(lái)看看。本文介紹的方法操作簡(jiǎn)單快捷，實(shí)用性強(qiáng)。下面就讓小編來(lái)帶大家學(xué)習(xí)“css如何設(shè)置元素透明度”吧!

在css中，可以使用opacity屬性來(lái)設(shè)置元素的透明度，只需要給元素添加“opacity:value;”樣式即可；其中參數(shù)“value”指定元素的透明度，值的范圍為“0.0~1.0”，“0.0”表示完全透明，“1.0”表示完全不透明。

本教程操作環(huán)境：windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。

CSS設(shè)置元素的透明度（不透明度）

方法：使用CSS3 opacity 屬性

作用：設(shè)置元素的透明度

語(yǔ)法：

js

object.style.opacity=value

css

opacity: value|inherit;

參數(shù):

  • value：指定的透明度；范圍從0.0~1.0，0.0表示完全透明，1.0表示完全不透明。

  • inherit：opcity的值從父元素繼承;

Demo：

<!DOCTYPE html>
<html>
<head>
	<style> 
	div {
		background-color:red;
	}
	.demo{
		opacity:0.4;
		filter:Alpha(opacity=40); /* IE8 and earlier */
	}	
	</style>
</head>
<body>
	<div =>此元素不透明</div><br />
	<div class="demo">此元素的透明度為0.4！注意，文本和背景顏色都受不透明度級(jí)別的影響！</div>
 
</body>
</html>

效果圖：

css如何設(shè)置元素透明度

到此，相信大家對(duì)“css如何設(shè)置元素透明度”有了更深的了解，不妨來(lái)實(shí)際操作一番吧！這里是億速云網(wǎng)站，更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢，關(guān)注我們，繼續(xù)學(xué)習(xí)！

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

css
AI
助
手