CSS中如何设置父元素透明度不影响子元素透明度
原因分析: 使用css的opcity属性改变某个元素的透明度,但是其元素下的子元素的透明度也会被改变,即便重定义也没有用,不过有个方法可以实现,大家可以看看。
可以使用一张透明的图片做背景可以达成效果,但是有没有更简单的方法呢?使用 RGBA。
例如:
设置父元素opacity:0.5,子元素不设置opacity,子元素会受到父元素opacity的影响,也会有0.5的透明度。
即使设置子元素opacity:1,子元素的opacity:1也是在父元素的opacity:0.5的基础上设置的,因此子元素的opacity还是0.5。
解决方法:为父元素设置background: rgba(0,0,0,0.5)。
CSS中如何设置父元素透明度不影响子元素透明度的更多相关文章
- 父div的透明度不影响子div透明度
在设置div的透明度的时候如果设置了父div的透明度(opacity=0.8),那么子div的透明度也随着改变了,并且设置子div的透明度不起作用. 这种情况下可以使用rgba来设置父div的透明度: ...
- CSS 设置背景透明度,不影响子元素
由于 opacity 属性能被子元素继承,使用它设置父元素背景透明度时也会影响子元素. 解决方法: 1> 使用 RGBA Example .classname { /* RGBa, 透明度0.6 ...
- 父元素高度设置为min-height,子元素高度设置为100%,但实际上子元素高度你知道是多少吗?
前言 给父元素一个min-height,子元素设置height:100%. 代码 <!DOCTYPE html> <html> <head> <title&g ...
- LinearLayout的gravity属性以及其子元素的layout_gravity何时有效;RelativeLayout如何调整其子元素位置只能用子元素中的属性来控制,用RelativeLayout中的gravity无法控制!!!
LinearLayout的gravity属性以及其子元素的layout_gravity何时有效:RelativeLayout如何调整其子元素位置只能用子元素中的属性来控制,用RelativeLayou ...
- 二、vue学习--父元素如何获取子元素的值,子元素如何获取父元素的值
下图是父元素: 下图是子元素,获取父元素的值,使用props定义属性,这样就可以获取到父元素上传过来的set .place.type,拿到值就可以做一些自己的逻辑处理 二.子元素给父元素传值? 下 ...
- js将数组中一个或多个字段相同的子元素中合并
最近js中遇到js将数组中一个或多个字段相同的子元素中合并,相信很多朋友也有遇到,大家可能有多种方法,我在这里记录一个相对简单的方法,当然大家如有其它更好的方法,请提出来大家共同学习. //将经济事项 ...
- 改变父元素的透明度,不影响子元素的透明度—css
1.如果我们给父元素添加opacity:0.4后,子元素的red颜色也变成了0.4的透明度, 例子如下: <!DOCTYPE html> <html> <head> ...
- CSS中怎么设置元素水平垂直居中?
记录怎么使用text-align与vertical-align属性设置元素在容器中垂直居中对齐.text-align与vertical-align虽然都是设置元素内部对齐方式的,但两者的用法还是有略微 ...
- CSS中父元素高度没有随子元素高度的改变而改变,应该如何解决?
如果子元素没有设置浮动(float),父元素实际上会根据内容,自动宽高进行适应的. 当子元素增加了浮动后,最简单的处理方法是给父元素添加overflow:hidden属性,此时父元素的高度会随子元素的 ...
随机推荐
- spring mvc 绑定参数据默认值,是否必传,(RequestParam(value="id",defaultValue="1",required=true) )
@RequestMapping(value = "/detail", method = RequestMethod.GET) public String newDetail(@Re ...
- Oracle Fetch子句
Oracle Fetch子句 作者:初生不惑 Oracle基础 评论:0 条 Oracle技术QQ群:175248146 在本教程中,将学习如何使用Oracle FETCH子句来限制查询返回的行数. ...
- 170815-关于Filter的知识点
Filter简介: Filter翻译为中文是过滤器的意思. Filter是JavaWeb的三大web组件之一:Servlet.Filter.Listener ...
- es之java操作插入文档
4方式: . 使用json字符串直接创建 . 使用Map集合 . 使用第三方库来序列化 createDocumentBySerialize . 使用内置的帮助器XContentFactory.json ...
- Oracle诊断:在程序的运行中,有时候数据库会断开连接
在程序的运行中,有时候数据库会断开连接,然后报下面错误: ORA-12519: TNS:no appropriate service handler found 可用的服务处理程序没有找到. 1. ...
- ASM磁盘组删除磁盘
ASM磁盘组删除磁盘 [oracle@dbserver1 ~]$ su - gridsqlplus / as sysasmConnected.SQL> alter diskgroup data ...
- uid auid euid的区别
关于euid suid guid,参考这篇很好的文章 uid auid euid的区别? initially: 最初地, 一开始地 jackson had initially bloodied his ...
- PriorityBlockingQueue 源码分析
PriorityBlockingQueue PriorityBlockingQueue 能解决什么问题?什么时候使用 PriorityBlockingQueue? 1)PriorityBlocking ...
- Vue知识整理2:Vue生命周期方法
在vue执行过程中,可以分为beforeCreate.created.BeforeMount.mounted .BeforeUpdate.updated 等常用的方法,如下图所示. 除此之外,通过查 ...
- SpringBoot系列:二、SpringBoot的配置文件
SpringBoot的配置文件在resources文件夹下 springboot的配置文件支持两种形式的写法,一种是经典的properties另一种是yml yml通过空格缩进的形式来表示对象的层级关 ...