標籤：safari utf-8 margin ref ie8 set jpg chrome 透明
CSS 映像透明/不透明CSS Opacity屬性是W3C的CSS3建議的一部分。
建立透明映像 - 懸停效果建立一個透明映像
CSS3中屬性的透明度是 opacity。
img
{
opacity:0.4;
filter:alpha(opacity=40); /* IE8 及其更早版本 */
}
IE9，Firefox，Chrome，Opera，和Safari瀏覽器使用透明度屬性可以將映像變的不透明。 Opacity屬性值從0.0 - 1.0。值越小，使得元素更加透明。
IE8和早期版本使用濾鏡：alpha（opacity= x）。 x可以採取的值是從0 - 100。較低的值，使得元素更加透明。
映像的透明度 - 懸停效果
CSS樣式：
img
{
opacity:0.4;
filter:alpha(opacity=40); /* IE8 及其更早版本 */
}
img:hover
{
opacity:1.0;
filter:alpha(opacity=100); /* IE8 及其更早版本 */
}
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>映像透明</title> <style> div{ width: 182px; height: 141px; margin: 300px auto; } div img{ opacity: 0.7; filter: alpha(opacity=70); } div img:hover{ opacity: 1; filter: alpha(opacity=100); } </style></head><body> <div> <img src="beauty.jpg" alt="美女"/> </div></body></html>
CSS建立透明映像
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
