首页 > 开发 > CSS > 正文

CSS 图像透明度

2020-03-24 17:16:31
字体:
来源:转载
供稿:网友

通过 CSS 创建透明图像是很容易的。

注释:CSS opacity 属性是 W3C CSS 推荐标准的一部分。


创建透明图像 - Hover 效果在本例中,当用户将鼠标指针移动到图片上时,会改变图片的透明度。创建文本在背景图像上的透明框本例创建了一个包围文本的半透明框。

IE9, Firefox, Chrome, Opera 和 Safari 使用属性 opacity 来设定透明度。opacity 属性能够设置的值从 0.0 到 1.0。值越小,越透明。

IE8 以及更早的版本使用滤镜 filter:alpha(opacity=x)。x 能够取的值从 0 到 100。值越小,越透明。


第一个 CSS 代码块类似实例 1 中的代码。此外,我们已经设置了当鼠标指针位于图像上时的样式。在这个例子中,当指针移动到图像上时,我们希望图像是不透明的。

对应的 CSS 是:opacity=1。

IE8 以及更早的浏览器:filter:alpha(opacity=100)。

当鼠标指针移出图像后,图像会再次透明。


This is some text that is placed in the transparent box. This is some text that is placed in the transparent box. This is some text that is placed in the transparent box. This is some text that is placed in the transparent box. This is some text that is placed in the transparent box.

郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

上一篇:CSS 注意事项

下一篇:CSS 高级语法

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表