close

CSS3 opacity Property 套用樣式 不透明度

支援CSS3 以上

用法： opacity
說明：
設定不透明度
0~1
0%~100%
0為透明
1為不透明度

css定義：
設定不透明度0.5
#div1{
background-color: rgb(012,150,150);
opacity:0.5;
}
注意事項：
 **IE8 的使用方式
 filter: Alpha(opacity=50);

JavaScript 用法:
object.style.opacity="0.5"

程式：
<!DOCTYPE html>
<html>
<head>
<title>CSS3 opacity Property 套用樣式 不透明度</title>
<meta http-equiv="Content-Type" content="text/html; charset=BIG5">
<style type="text/css">
#div1{
background-color: rgb(012,150,150);
opacity:0.5;
}
#div2{
background-color: rgb(012,150,150);
}
</style>
</head>
<body>
<div id="div1">
div 1 Tag CSS opacity:0.5;
</div>
<div id="div2">
div 2 Tag CSS
</div>
</body>
</html>

圖1：




測試結束~
如果還不了解可參考：w3schools CSS3 opacity Property


opacity 測試


感謝~




 






 

 

 














其它文章


arrow
arrow
    文章標籤
    css3 opacity property background color 套用 明度 不透 用法
    全站熱搜
    創作者介紹
    創作者 PG Levin Li 的頭像
    PG Levin Li

    程式開發學習之路

    PG Levin Li 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄