opacity · 跟老司機學CSS3

**opacity** * 描述：設置對象的不透明度。 * 版本：CSS3 * 繼承性：無 **語法** ``` opacity：數值; ``` 數值使用浮點數設置對象的不透明度，數值可以使 0.0 - 1.0 之間，如果超過了這個范圍，其計算結果將截取到與之最相近的值。 **使用說明** 對于不支持 opacity 屬性的 IE 瀏覽器可以使用 IE 私有的濾鏡屬性來實現與 opacity 相同的效果。例如： `div{filter:alpha(opacity=50);}` IE8 及之前的版本可用對象若設置了值小于 1 的 opacity，將會產生局部層疊上下文。 **代碼示例** ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>opacity</title> <style> #container{ width: 50px; height: 50px; background: #000000; color: red; font-size: 20px; opacity: .5; } </style> </head> <body> <div id="container"> ok </div> </body> </html> ``` 可以看到，字體顏色也不像紅色，背景顏色也不像黑色。 ![opacity](https://box.kancloud.cn/24bca3d434faf7f4b1141f6b0fa0fde7_61x64.png)