0
0
聖光之護
发布时间：2024-11-08 14:12:01
|668人浏览过
|来源于php中文网
原创
背景图片透明度设置
如何使用 css 设置背景图片的透明度，使其背后的文字清晰可见？
虽然尝试了 background-color: rgba(255, 255, 255, 0.5); 但效果不显。
解决方案
立即学习“前端免费学习笔记（深入）”；
可以使用伪元素代替背景层来实现：
.warp {
position: relative;
}
.warp:before {
position: absolute;
content: "";
opacity: 0.6; /* 透明度 */
background-image: url('xxxx');
top: 0;
left: 0;
right: 0;
bottom: 0;
}通过设置伪元素的 opacity 属性，可以控制背景图片的透明度，让背后的文字清晰可见。
相关文章
css如何改变flex主轴方向_实现水平或垂直布局切换
css 初级项目导航栏不居中怎么办_通过 flex 布局实现水平垂直居中
css动画元素旋转角度不正确怎么办_检查transform-origin设置
css 盒模型 行高会影响盒子高度吗_通过理解 line height 参与计算方式
css 浮动布局中中间列自适应怎么实现_通过宽度计算方式解释
相关标签:
本站声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
热门AI工具
Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
