HTML中背景图透明度怎样控制,方法是什么?
导读:这篇文章我们来了解HTML中背景图透明度的设置,有时候我们在使用背景图片的时候,想要降低一点透明度,但又不想每张图片单独设置,那么使用opacity属性或者filter属性就能很好的解决。下文有详细的介绍,有需要的朋友可以参考,接下来就跟随...
这篇文章我们来了解HTML中背景图透明度的设置,有时候我们在使用背景图片的时候,想要降低一点透明度,但又不想每张图片单独设置,那么使用opacity属性或者filter属性就能很好的解决。下文有详细的介绍,有需要的朋友可以参考,接下来就跟随小编来一起学习一下吧!
本教程操作环境:windows7系统、CSS3& & HTML5版、Dell G3电脑。
html给背景图片设置透明度
1、使用opacity属性
!DOCTYPE html> html> head> style type="text/css"> div { width: 300px; height: 300px; background-image: url(img/3.jpg); } .box{ opacity: 0.5; } /style> /head> body> div> 背景图片/div> div class="box"> 背景图片/div> /body> /html>
2、使用filter属性
!DOCTYPE html> html> head> style type="text/css"> div { width: 300px; height: 300px; background-image: url(img/3.jpg); } .box{ filter: opacity(0.6); } /style> /head> body> div> 背景图片/div> div class="box"> 背景图片/div> /body> /html>
以上就是HTML中背景图透明度的设置方法,上述两种方法具有一定的参考价值,有需要的朋友可以了解看看,希望对大家学习HTML的使用有帮助,想要了解更多可以继续浏览网络其他相关的文章。
文本转载自PHP中文网
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: HTML中背景图透明度怎样控制,方法是什么?
本文地址: https://pptw.com/jishu/655226.html