首页前端开发JavaScripthtml如何给背景图片设置透明度

html如何给背景图片设置透明度

时间2024-01-29 19:41:03发布访客分类JavaScript浏览686
导读:收集整理的这篇文章主要介绍了html如何给背景图片设置透明度,觉得挺不错的,现在分享给大家,也给大家做个参考。htML给背景图片设置透明度的方法:1、使用OpacITy属性,给设置背景图片的元素添加“opacity:透明度值;”样式即可;2...
收集整理的这篇文章主要介绍了html如何给背景图片设置透明度,觉得挺不错的,现在分享给大家,也给大家做个参考。

htML给背景图片设置透明度的方法:1、使用OpacITy属性,给设置背景图片的元素添加“opacity:透明度值; ”样式即可;2、使用filter属性,给设置背景图片的元素添加“filter: opacity(透明度值); ”样式即可。

本教程操作环境: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如何给背景图片设置透明度的详细内容,更多请关注其它相关文章!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

html背景图片

若转载请注明出处: html如何给背景图片设置透明度
本文地址: https://pptw.com/jishu/591513.html
html5怎么创建跳转页尾超链接 html中怎么让列表横向排列

游客 回复需填写必要信息