在CSS3中，我們可以使用opacity屬性來控制元素的透明度。
語法：
opacity:數值;
說明：
opacity屬性取值范圍為0.0~1.0，0.0表示完全透明，1.0表示完全不透明（默認值）。
opacity屬性取值不可以為負數。
舉例：
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS3 opacity屬性</title>
<style type="text/css">
a
{
display:inline-block;
padding:5px 10px;
font-family:微軟雅黑;
color:white;
background-color:#45B823;
border-radius:4px;
cursor:pointer;
}
a:hover
{
opacity:0.8;
}
</style>
</head>
<body>
<a>調試代碼</a>
</body>
</html>
在浏覽器預覽效果如下：
分析：
我們在“在線測試工具”中為div層加上“opacity:0.5;”這句屬性，在浏覽器預覽效果如下：
大家可以看到，加上了“opacity:0.8”屬性之後，元素的透明度增加了。如果加上“opacity:1.0”則元素會變得完全透明。大家可以嘗試修改測試一下。
透明度opacity屬性用得也比較廣泛，很多時候都是配合:hover偽類來定義鼠標移動到某個按鈕或圖片上時，改變透明度來呈現動態的效果。