使用了position属性值为 absolute、relative 的层，将会比普通层更高层次。使用了小于1的opacity属性的层，也比普通层更高层次并且和指定 position 的层同层，但是不支持 z-index 属性，所以指定 position 的层，可以使用 z-index 属性，来覆盖带有小于1的 opacity 属性的层。

想法：可以使用position：relative 来覆盖opacity小于的元素。

避免：尽量避免在下拉菜单使用透明度，可改用更换颜色的形式。

opacity层叠问题的更多相关文章

  1. 谈谈一些有趣的CSS题目（三）-- 层叠顺序与堆栈上下文知多少

    开本系列,讨论一些有趣的 CSS 题目,抛开实用性而言,一些题目为了拓宽一下解决问题的思路,此外,涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题中有你感觉 ...

  2. CSS——关于z-index及层叠上下文（stacking context）

    以下内容根据CSS规范翻译. z-index 'z-index'Value: auto | <integer> | inheritInitial: autoApplies to: posi ...

  3. 一篇通俗易懂的CSS层叠顺序与层叠上下文研究

    网上有很多这方面的教程,但不是苦涩难懂就是从哪copy过来的,反正很长一段时间我是没看懂,时间长了也没打算去研究了,主要原因是,基本上很少会遇到那些问题(所以说啊,要是没有研究精神的才懒得管它).但自 ...

  4. 深入理解CSS中的层叠上下文和层叠顺序(转)

    by zhangxinxu from http://www.zhangxinxu.com 本文地址:http://www.zhangxinxu.com/wordpress/?p=5115 零.世间的道 ...

  5. 深入理解CSS中的层叠上下文和层叠顺序

    零.世间的道理都是想通的 在这个世界上,凡事都有个先后顺序,凡物都有个论资排辈.比方说食堂排队打饭,对吧,讲求先到先得,总不可能一拥而上.再比如说话语权,老婆的话永远是对的,领导的话永远是对的. 在C ...

  6. 层叠上下文(The stacking context)

    MDNThe stacking context 层叠上下文是HTML元素的三维概念,这些HTML元素在一条假想的相对于面向(电脑屏幕的)视窗或者网页的用户的z轴上延伸,HTML元素依据其自身属性按照优 ...

  7. CSS中 opacity的设置影响了index（层数）的改变

    在使用 opacity 属性来实现页面整体透明的时候,发现了一个问题.如果两个层发生了重叠,使用了 opacity 属性并且属性值小于1的层,会覆盖掉后面的层.于是动手做了个实验,来验证 opacit ...

  8. 层叠上下文 Stacking Context

    层叠上下文 Stacking Context 在CSS2.1规范中,每个盒模型的位置是三维的,分别是平面画布上的x轴,y轴以及表示层叠的z轴.对于每个html元素,都可以通过设置z-index属性来设 ...

  9. 当fixed元素相互嵌套时chrome下父元素会影响子元素的层叠关系

    问题:fixed元素被另一个fixed元素包含的时候在chrome下fixed子元素的定位会受到父元素的影响. demo(http://jsbin.com/qumah/1): <!DOCTYPE ...

随机推荐

  1. 学习VBA

    学习VBA VBA 就是 (Visual basic for Application) 用的比较多的是在Excel中处理数据,可以方便快捷地使用编程方式来对数据进行操作. VBA 数据类型 Integ ...

  2. Git基础概念与Flow流程介绍

    目录 Git相关 基本概念 常见客户端 TortoiseGit Sourcetree Intellij Idea 命令行 常用命令 存储区域 命令之 add & commit &pus ...

  3. vue-cli 脚手架安装

    1.安装node;选择适合自己系统的文件,下载一路next , a安装成功后,打开运行输入cmd 进入命令行: 在命令行工具中输入 npm -v  检查版本号 如果出现 则安装成功:(npm为node ...

  4. hadoop之yarn详解（框架进阶篇）

    前面在hadoop之yarn详解(基础架构篇)这篇文章提到了yarn的重要组件有ResourceManager,NodeManager,ApplicationMaster等,以及yarn调度作业的运行 ...

  5. 什么是javascript字面量，常量，变量，直接量？

    1.字面量是变量的字符串表示形式.它不是一种值,而是一种变量记法. var a = 1 //1是字面量 var b = 'css' //css是字面量 var c = [5,6,7] //567是字面 ...

  6. Kotlin 中的伴生对象和静态成员

    用了一段时间kotlin,越用越觉得好用,爱不释手啊,留点笔记. Kotlin 中,在类中定义的对象(object)声明,可使用 companion 修饰,这样此对象(object)就是伴生对象了.类 ...

  7. VBS定时关闭软件

    用TXT写以下代码另存为VBS格式,代码如下:doset bag=getobject("winmgmts:\\.\root\cimv2")set pipe=bag.execquer ...

  8. Mybatis入门简版（二）

    一.Dao层开发的方式 以前dao层开发比较繁琐,写了接口还得写实现类,实际上用了Mybatis之后写实现类非常重复,都是重复的代码.那么此时改成另外一种简单形式. 遵循以下四个原则(名称.形参.返回 ...

  9. Vue成员获取

    0828自我总结 Vue成员获取 一.vue中data的获取 1.获取data里面的某个变量 $data.msg也可以简写成msg 2.获取data全部内容 $data 二.获取vue中vue挂钩的对 ...

  10. vc++中字符串的免杀

    一:格式字符: http://baike.baidu.com/view/2194593.htm d:以十进制形式输出带符号整数(正数不输出符号)o:以八进制形式输出无符号整数(不输出前缀o)x:以十六 ...