mask(模态框)子元素继承父元素的透明度问题

最新推荐文章于 2024-09-22 18:09:09 发布

北刘庄我最帅

最新推荐文章于 2024-09-22 18:09:09 发布

阅读量385

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_34849724/article/details/80507277

本文介绍了如何使用CSS来设置元素的透明度，并探讨了不同方式实现透明度的效果对比，包括使用rgba颜色值、opacity属性及IE浏览器特有的filter属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

继承写法：父元素：z-index:1000; backgroung-color:black; opacity:0.5;
不继承： background-color: rgba(0,0,0,0.6)!important;
background-color: #000;
filter:Alpha(opacity=60);
或者：.opacity{background: #000；opacity：0.7}

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

北刘庄我最帅

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

里海NX二次开发3000例-专栏目录

王牌飞行员_里海的博客

09-15

4502

UDO(User Defined Object)是“用户自定义对象”。应用非常广，可以用UDO创建自定义特征，也可以对NX原有的特征添加一些特殊信息，这些信息会保存在部件中，以后可以查询。还可以实时追踪NX对象，例如做3D包容盒线框自动追踪实体，做2D矩形框自动追踪图纸尺寸值，这些在下面的例子都有介绍。读者可以自己编译下面的例子，体会理解UDO的用法。------里海 20230512序号内容链接01使用UDO在所有实体上设置更新回调链接02使用UDO生成跟踪实体的线框链接03删除UDO链接。

VC++中使用使用winnet类获取网页内容

guomei的专栏

02-22

1万+

2005-09-01VC++中使用使用winnet类获取网页内容 - [VC专栏]微软提供的Winnet类是一个应用层的网络通信组件，它可以使你的应用程序很容易的实现http、ftp、gopher等协议而不需要你去深入的了解协议本身的规范。而之前，如果要想做类似的应用，我们必须了解socket编程并且要对协议本身非常熟悉，哪怕是一个非常非常简单的程序。下面是codegur

参与评论您还未登录，请先登录后发表或查看评论

html、css和js原生写一个模态弹出框，顺便解决父元素半透明子元素不透明效果...

风雨飘飘飘啊飘的博客

10-23

187

模态框： html部分：  <button id="box" onclick="pop_box()">弹出框</button>  <div class="div-container" id="div-container" style="display: no...

4 前端溢出定位 模态框 透明度 JavaScript简介

健浩的博客

05-14

743

前端 1 溢出属性overflow overflow属性规定当内部内容溢出元素框时发生的事情。 overflow: visible （默认值）内容不会被修剪，会呈现在元素框之外。 overflow: hidden 内容会被修剪，并且其余内容是不可见的。 overflow: scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。 overflow: auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。 overflow: inherit 规定应该从父元素继承overflo

javascript 模态对话框背景半透明效果

liutonglai的专栏

09-24

1517

function ShowDialog() { var objDialog = document.createElement('div') ; objDialog.id = "bgDialog"; var oS = objDialog.style; oS.display = "block"; oS.top = "0px"; oS.left = "0px"; oS

模式对话框Dialog背景的透明度&黑暗度设置方法

crane

08-08

2335

设置透明度（貌似是dialog自身的透明度） WindowManager.LayoutParams lp=dialog.getWindow().getAttributes(); lp.alpha=1.0f;

css制作模态框透明度继承问题

蓝枫秋千的踩坑记录

09-29

323

使用css来制作模态框一般都是这样想的: 1.先写一个层罩,透明度设为0.5什么的 2.再写主体内容,透明度重新设置为1 但是你会发现,主体内容的透明度没有达到你想要的效果,为什么呢,这就是opacity的继承问题了解决方案有两个: 1.仍然使用透明度来做,但是需要将层罩的定位方式设置为relative,层罩的定位设置为absolute,在按照原本的方式来制作就好了 .out,body,html...

QWidget Class

热门推荐

weixin_34237596的博客

03-08

1万+

Github用法 git-recipesGit recipes in Chinese. 高质量的Git中文教程. lark怎样在Github上面贡献代码 my-git有关 git 的学习资料 gitignore非常赞有用的.gitignore模板集合(忽略上传的文件集合)，包含了各种语言. 完整App@ open-source-ios-apps- iOS开源App集合，分：swift与Objec...

计算机系统类词汇

08-02

2538

abbreviate vt.缩写，省略 abbreviation n.缩短，省略，简称 abend 异常结束abnormal 异常abort 异常中止aboveboard ad.照直，公开的absence n.缺少，没有absolute 绝对absorption 吸收abstract 抽象acceleration 加速度accelerator n.加速装置，加速剂accent 强调accept 接

如何模态出一个半透明页面

YST的博客

10-19

466

一般在做自定义弹框时或者点击展示大图时用的较多。不说了上代码https://github.com/YST521/DEMOLIST.git //第一步A页面跳转到B页面 MOdalPopController * popVC = [MOdalPopController new]; popVC.view.backgroundColor = [UICol...

css 透明度引发的思考

weixin_33698823的博客

03-13

2019独角兽企业重金招聘Python工程师标准>>> ...

ant design modal点击mask弹框不消失的问题

sflwolf的专栏

01-11

1508

在用ant design写的a-modal时，因为不使用确认和取消按钮所以设置了 :footer="null"。自然而然也没有设置@ok 和@cancel函数，然后右上角默认的close死活不生效，点击mask部分也不能关闭弹框；经过一点点试发现，即使不用确认和取消，也要定义。定义了@ok 和@cancel之后点击mask关闭弹框就生效了。

点击按钮，生效一次，遮罩层方法

weixin_42464250的博客

01-17

962

$.ajax({ type:"POST", dataType: "json", url:"{:url('Service/center')}", data:{'record':record,'pid':pid,'pad':pad,'type':1}, beforeSend:function(){ $.mask_fullscreen(); ...

bootStrap模态框实现可拖拽、半透明功能

di4zhibiao的博客

08-14

3089

String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %> "> My J

vue3 antd项目实战——Modal弹窗自定义遮罩（利用maskStyle属性自定义遮罩样式）

XSL_HR的博客

01-13

5370

在后台管理系统的项目开发中，弹窗组件用到的地方很多。由于自带的默认样式不太符合视觉要求，因此需要利用maskStyle属性来自定义modal弹窗的遮罩样式。

JavaScript 自己手写实现一个弹窗

m0_49016709的博客

07-03

3385

项目中有很多地方会使用到弹窗，现在咱们自己写一个有弹出效果的弹窗. html 部分一个按钮一个弹窗盒子一个蒙板层代码：  <style> .btn{display: inline-block;padding: .2rem .4rem;border-radius: .1rem;border: 1px solid #dddddd;font-size: .26rem} .confirmBox{width: 70%;margin-left: 15%;

微信小程序の自定义弹窗

胖子ღ牛逼

01-13

1036

自定义弹框，话不多说先上效果图~哈哈哈开始上代码啦。首先在 wxml 上写蒙层属类modal-mask和弹框层 modal-dialog，此层又分为三部分，title、content、footer 很经典的结构对不对！

Vue组件开发实战：模态框详解与实现

6. **遮罩层（Mask Layer）**：全屏覆盖的半透明层，用于阻止用户与背景交互，点击遮罩层默认会关闭模态框。在实际开发过程中，你需要在`src/components`目录下创建一个新的Vue组件文件，例如`Modal.vue`，并在...