【CSS】opacity 父元素设置透明度影响子元素显示效果解决方案

复制代码
<div class="father">
    <div class="children">
    </div>
</div>


.father{
    background:#000000,
    opacity:0.6
}

给父元素设置透明度时,子元素显示效果会搜到父元素透明度的影响,如下图

解决方法:

复制代码
.father{
    background:regb(0,0,0,0.6)
}

效果如图:

相关推荐
江城开朗的豌豆2 分钟前
Vue路由传参避坑指南:params和query的那些猫腻
前端·javascript·vue.js
十里青山10 分钟前
超好用的vue图片预览插件更新啦,hevue-img-preview 7.0.0版本正式发布,支持vue2/vue3/移动/pc,增加缩略图、下载、自定义样式等
前端·javascript·vue.js
lichenyang45319 分钟前
css模块化以及rem布局
前端·javascript·css
小熊哥^--^20 分钟前
条件渲染 v-show与v-if
前端
棉花糖超人28 分钟前
【从0-1的CSS】第3篇:盒子模型与弹性布局
前端·css·html
小小小小宇8 小时前
虚拟列表兼容老DOM操作
前端
悦悦子a啊8 小时前
Python之--基本知识
开发语言·前端·python
安全系统学习9 小时前
系统安全之大模型案例分析
前端·安全·web安全·网络安全·xss
涛哥码咖9 小时前
chrome安装AXURE插件后无效
前端·chrome·axure
OEC小胖胖9 小时前
告别 undefined is not a function:TypeScript 前端开发优势与实践指南
前端·javascript·typescript·web