子元素如何不继承父元素透明度

最新推荐文章于 2024-03-14 15:29:21 发布
最新推荐文章于 2024-03-14 15:29:21 发布
阅读量634 收藏
点赞数
文章标签： c/c++
原文链接：http://www.cnblogs.com/lvke/p/4275231.html
版权

opacity设置透明度子元素会继承

可以这么写，background-color:rgba(55,167,215,0.5);使用rgba子元素不会继承，但ie7,8不支持rgba

换个角度，可以不让他成为子元素，使用绝对定位使其看起来像子元素

 

转载于:https://www.cnblogs.com/lvke/p/4275231.html

weixin_30535167
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
CSS3不透明度实例讲解
09-24
- 此外，`opacity`属性具有继承性，如果设置为`inherit`，则元素将继承其父元素的不透明度。 2. **浏览器兼容性**： - 对于IE浏览器，由于不支持`opacity`属性，我们可以使用其私有的滤镜（filter）属性来实现...
css常用元素及使用说明
06-08
- `:first-child`：父元素的第一个子元素。 ##### 2. 常用伪元素 - `::before`：在元素内容之前插入内容。 - `::after`：在元素内容之后插入内容。 - `::first-letter`：元素中的第一个字母。 - `::first-line`：...
详解CSS-opacity子元素继承父元素透明度的解决方法
11-19
在写项目页面的过程中，遇到子元素继承父元素透明度的问题，查找了好多文档给出的都是第一种方法，这种方法主要解决简单场景的，而对于设置复杂的background时，该方法不再适用。
css 子元素不继承父元素的透明度
Queen-Shir的博客
08-29 5475
用opacity给父元素设置透明度，无论如何子元素都会继承父元素的透明度，最简单的方法就是： 将父元素的 opacity:0.5; 改为 background:rgba(0,0,0,0.5) 十六进制颜色码与RGB颜色值 在线转换网址： http://www.sioe.cn/yingyong/yanse-rgb-16/...
css子类不继承父类的透明度
张井乙ccccyc的博客
02-22 4142
关于这种有两种解决办法 1、是用把父类取消换成绝对定位的写法，这样就不存在继承。（这里不做过多阐述） 2、是在父类加特定css代码上代码.父级类{ background:rgba(0,0,0,0.2) none repeat scroll !important; /*实现FF背景透明，文字不透明*/ filter:Alpha(opacity=20);/*实现IE背景透明*/ }
不想子元素继承父元素的透明度
M40153c的博客
03-16 506
将父元素的opacity设置为0.5之后，子元素一定会继承这个属性，且对子元素单独设置opacity，也无效。 这样会导致opacity属性无效，我们可以通过将背景色转换为RGG值， background:rgb(0,0,0,0.5),最后一位表示透明度，然后再子元素设置opacity，发现有效（不考虑兼容性）；代码如下 ...
CSS设置父元素透明度时，如何不让子元素继承
CSND7997的博客
09-20 1828
需求： 获取16进制颜色之后转换成rgba颜色，然后设置rgba参数的第四个参数，透明度，子元素则不会继承 changeBgc(e) { let temColor = this.fromHex(this.changeColor(e.ddShiftCodeSource)); return { "background-color": `rgba(${temColor.r},${temColor.g},${temColor.b} , 0.3)`,
PS 父图层与子图层
06-01
父图层可以控制其下所有子图层的可见性、混合模式、不透明度等属性，一旦改变父图层的这些设置，所有子图层都会受到影响。 接下来，我们要了解“子图层”（Child Layer）。子图层是相对于父图层而言的，位于父图层...
常用的四种CSS透明属性介绍
09-25
当为父元素设置了透明度，其所有子元素都会继承这一属性，即使你为子元素单独设置了100%的不透明度（即`opacity: 1;`），它们仍会受到父元素的影响而保持一定程度的透明。这个问题在处理文本时尤为突出，因为透明的...
html父级透明度,不继承父级透明度和背景颜色渐变【原创】
weixin_33215027的博客
06-16 633
1.写页面经常会遇到背景颜色会产生由深到浅或者由浅到深的情况，本以为很简单的一个小样式处理下就好，.preferred-case-box{background:-webkit-gradient(linear, 0% 0%, 0% 100%,from(#0084b5), to(#00c5b9));}但是后来猛然发现这串样式导致页面背景仅仅在谷歌浏览器里有效果，其他浏览器都没有 预期的效果，经过多方询...
如何防止子容器继承父容器的透明度？用rgb背景替代opacity即可
最新发布
WenZhengshi的博客
03-14 543
在这个示例中，父容器的背景色具有一定的透明度，而子容器的背景色保持不透明，不受父容器透明度的影响。属性会影响元素及其所有子元素的透明度。但如果你想让子元素保持不透明，可以使用。这样做可以确保子容器不受父容器透明度的影响。要防止子容器继承父容器的透明度，可以使用 CSS 中的。
解决子元素继承父元素透明度问题
amaoagou_0124的博客
06-11 1207
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <style> html,body { margin:
子元素继承父元素透明度问题
香太深的博客
01-11 468
透明效果子元素继承
html css防止子元素继承父元素透明度
WenZhengshi的博客
02-02 475
background:rgba(0,0,0,0.5) ;opacity: 0.95;
解决父元素opacity会影响子元素的问题
owo_ovo的博客
09-07 1068
如何解决父元素的opacity影响子元素的问题
子元素的div不继承父元素的透明度
weixin_30709929的博客
10-29 180
问题一： 如何让logo部变成这样： 步骤一：先收一个大的div,上面logo+nav再一个div,下面是三个div横排着； 步骤二：最主要的是如何让上面的部分变暗，而logo的颜色不变暗？ 答案：在包住logo+nav的div里设置backgroubd-color :rgba(0,0,0,0.3)就可以了 转载于:https://www.cnblogs.com/zhaowenx...
关于子元素继承父元素透明度（opacity）的解决方法
JasonMa2010的专栏
07-30 1万+
今天在做移动端的时候遇到了子元素继承父元素的透明度（opacity）的情况，下面贴出解决方法： 问题重现： .opacity{background: #000；opacity：0.7} 这种写法就算给子元素opacity_child重新赋值opacity：1；他也同样会继承父元素opacity的值。 正确写法： .opacity{background: rgba(0,0,0,.7);}
html子元素不继承父元素（opacity）的解决方法
热门推荐
Poker Man
05-18 2万+
给父元素设置了背景颜色加透明background-color: #000; opacity: 0.5; -moz-opacity: 0.5; filter: alpha(opacity=50);发现效果是子元素也继承了父元素的属性 字也变的透明，如果不希望这样，可以把上面的代码用下面的代码来代替background: rgba(0,0,0,.3); 效果如下图 这样字体就不会继承父元素的属性变的
CSS隐藏元素：display、visibility与opacity对比解析
当一个元素的`opacity`值设为0时，虽然看起来是隐藏的，但它仍然占据空间，其子元素的不透明度也会受到直接影响。这意味着，如果你只想隐藏元素而不改变其在页面布局中的位置，`opacity`不是最佳选择。 ### 区分这...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值