JS+CSS如何避免透明遮罩层对中间层的影响？

2013-01-28 05:01:23 648 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

VSCode背景美化：background-cover插件+自定义CSS透明化设置编辑器个性化定制是提升开发体验与专注度的重要方式。通过CSS样式覆盖与插件机制，可以实现对界面背景、面板透明度等视觉元素的深度控制。background-cover插件负责将壁纸注入工作台，而自定义CSS则解决面板遮挡问题，实现编辑器、侧边栏、状态栏的透明化。结合遮罩层设计，既保留壁纸观赏性，又保障代码可读性。该方案适用于本地开发环境，也可通过共享配置实现团队风格统一。本文从插件安装、settings配置到CSS选择器编写，完整演示VSCode背景美化流程，并涵盖常见问题排查技巧。阅读详情

我的asp.net IE8、9前台中，操作（添加、修改、删除等）页面在记录页面之上，我用JS将可挡住操作页面控件（input,button等）的透明遮罩层写入文档页面的办法实现警示对话框显示时用户无法操作页面控件的效果。但写入透明遮罩层之后，操作页面也跟着透明了。层结构如下如示：

　　　　　　----警示框（div）----　　　　　　　　　　　　　z-index = 20
-------------透明遮罩层（div）------------　　　　　　　z-index = 10
----------操作页面（div+iframe）----------　　　　　　　z-index = 5 受影响层
----------------------------数据记录页面（div+table）--------------------

现在头大如斗，如何解决这个问题啊？

PS：透明值设置为50%无法实现我需要的效果。

...全文

CSS背景透明文字不透明：伪元素与RGBA两种核心方案详解在网页设计与前端开发中，层叠样式表（CSS）的层叠上下文与视觉渲染原理是构建复杂视觉效果的基础。理解元素透明度（opacity）的继承性与全局影响，是解决“背景透明而文字需保持不透明”这一经典需求的关键。其技术价值在于实现视觉设计与内容可读性的平衡，广泛应用于Banner图、英雄区域和卡片式设计等场景。本文聚焦于两种主流方案：通过伪元素（::before/::after）分离渲染层，以及对背景色使用RGBA/HSLA颜色值，从而精准控制透明度，确保文字清晰可辨。阅读详情

pravity

.NET社区 62,271 成员 668,968 内容

+ 关注 + 加入社区

切换为时间正序

qq_23152823 2014-11-10

打赏
举报

同学，让透明层和中间层处于平级，然后用定位就可以解决你的问题啦，eg： <div class="透明层"></div> <div class="内容层"></div>

yyl8781697 2013-01-29

打赏
举报

引用 6 楼 pravity 的回复:

呵呵，楼上，JS脚本对前台执行效率是有影响的，只是现在的电脑性能比较好，一般人感觉不到罢了。对五、六年前买的电脑还是有影响的，特别是事件监听之类。我个人对程序执行效率一直非常重视，因为这涉及用户体验，所有的程序编制遵循效率优先的原则，能不写的代码一律不写。这个问题目前看来没有好的解决办法，只能通过调用父级窗口的JS来做个大的遮罩层（全屏遮盖）来实现了。 ……

尼玛这js绝对比你的服务器控件效率好多了真的注重效率就不要用服务器控件纯的html+js就可以了

pravity 2013-01-29

打赏
举报

呵呵，楼上，JS脚本对前台执行效率是有影响的，只是现在的电脑性能比较好，一般人感觉不到罢了。对五、六年前买的电脑还是有影响的，特别是事件监听之类。我个人对程序执行效率一直非常重视，因为这涉及用户体验，所有的程序编制遵循效率优先的原则，能不写的代码一律不写。这个问题目前看来没有好的解决办法，只能通过调用父级窗口的JS来做个大的遮罩层（全屏遮盖）来实现了。这个贴子结了。

yyl8781697 2013-01-29

打赏
举报

用js不会影响你多少效率的哥

pravity 2013-01-29

打赏
举报

我的前台后台一把抓的……这是目前碰到的最后一个要命的问题。因为作的是企业级项目，所以在外观上不得不做的好看且标准一点。如果这个方法实现不了，那就只能选择不使用遮罩层纯用JS屏蔽页面控件的方式达到预期目标了。不过这样会使代码量增加，前台负担又要加重了。

pravity 2013-01-29

打赏
举报

甚至连DataGrid这样的东西都不用，哈哈哈……个人极其鄙视.net用Form前后台交互伪装JS校验这样的模式，把前台能干的事情全部交到后台，难怪说bill.Gates的老婆是卖内存条的，老妈是卖硬盘的。当然，前台和后台的执行效率也要全面考量。

pravity 2013-01-29

打赏
举报

引用 7 楼 yyl8781697 的回复:

引用 6 楼 pravity 的回复: 呵呵，楼上，JS脚本对前台执行效率是有影响的，只是现在的电脑性能比较好，一般人感觉不到罢了。对五、六年前买的电脑还是有影响的，特别是事件监听之类。我个人对程序执行效率一直非常重视，因为这涉及用户体验，所有的程序编制遵循效率优先的原则，能不写的代码一律不写。这个问题目前看来没有好的解决办法，只能通过调用父级窗口的JS来做个大的遮罩层（全屏遮盖……

呵呵，我的服务器端代码是纯HTML + 纯C#执行代码的，没有用任何一个ASP.Net控件。