在实际开发中,div+css经常会碰到层级的问题

其中有个很头痛的就是z-index控制层级时,老是发现z-index不起作用

老杨依据自己的经验,总结出以下步骤:

1、判断被覆盖的层(想要置顶的层)的postion是否也为relative或者absolute

2、如果1成立,则判断是否此层的z-index比误覆盖的层的z-index数值大

3、如果2成立,判断是否此层的父级元素比误覆盖的层的z-index数值大

4、如果3成立,判断是否此层的父级元素比误覆盖的层的父级层的z-index数值大

到此为止,99%的该问题会得到解决!

内容不多,可是会非常实用!

解决position:relative情况下,z-index无效的方法的更多相关文章

  1. JanusGraph :Cassandra作为存储后端的情况下,JanusGraph的安装方法

    Cassandra作为存储后端的情况下,JanusGraph的安装方法 Cassandra作为存储后端的情况下,JanusGraph的安装分为四种方式. 分别是: 1.本地服务器模式(这里的服务器指的 ...

  2. 使用position:relative制作下边框下的小三角

    在制作tab选项卡的时候,有时会有下边框,且下边框下另一个头向下的小三角,这全然能够用css来实现,而不必使用背景图片. 由于使用背景图片时会有一个问题,选项卡内容字数不同.导致使用背景图片时无法控制 ...

  3. 解决xShell4某些情况下按删除键会输出^H的问题

    当我们用Xshell登录进入linux后,在普通模式下,对输入进行删除等操作没有问题. 而在执行中,按delete,backspace键时会产生^H等乱码问题. 这是由于编码不匹配的问题. 解决方法: ...

  4. 解决ie7,ie8下a链接无效问题

    .person a{ display: block; position: absolute; width: 109px; height: 33px; bottom: 19px; right: 40px ...

  5. 移动端响应式布局--你不知道的CSS3.0媒体查询,解决rem部分情况下无法适配的场景

    媒体查询作为响应式布局的方法之一,实际项目中用途也很广.但是你真的知道怎么用吗? 例如,下面匹配 iphone6/7/8 屏幕 @media screen and (max-width: 375px) ...

  6. Sql Server 如何解决多并发情况下,出现的多个相同ID数据

    在数据库中单独创建一张表,保存当前存储状态,“存储过程”  设置访问条件root初始值为“0” 如果root值不为0的时候就不可访问并进行相关操作. 在事务执行前将root值设置为1,事务结束后将ro ...

  7. 不使用jquery情况下循环添加绑定事件方法

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. Centos7多内核情况下修改默认启动内核方法

    1.1  进入grub.cfg配置文件存放目录/boot/grub2/并备份grub.cfg配置文件 [root@linux-node1 ~]# cd /boot/grub2/ [root@linux ...

  9. easyui日期在未加载easyui-lang-zh_CN.js出现英文的情况下加载中文的方法

    我们有时候在操作easyui的时候本来是加载了easyui-lang-zh_CN.js中文文件包,但是还是出现了英文.使得我们不得埋怨这框架咋这么不好用,其实我们仔细看看这个中文包就会发现里面很多都是 ...

随机推荐

  1. stop()方法的精准应用

    stop()方法在动画中扮演了很精彩的角色,他能够阻止连续动画或连续事件出现累积的状况,令动画有条不紊的进行. 1语法结构 stop([clearQueue],[gotoEnd]); 这两个参数都是可 ...

  2. 【转】C# 后台开启 cmd执行命令

    private void RunCmd(string cmd)     {         System.Diagnostics.Process p = new System.Diagnostics. ...

  3. OC11_自动释放池

    // // Dog.h // OC11_自动释放池 // // Created by zhangxueming on 15/6/18. // Copyright (c) 2015年 zhangxuem ...

  4. UEditor上传图片等附件都出现红叉

    我的环境: vs2010+netframework3.5+ueditor1_3_5-utf8-net 问题:UEditor上传图片等附件都出现红叉 尝试了网络上各种方法都不对, 后来只能自己看下ima ...

  5. Android的selector,背景选择器

    原文地址 http://android.blog.51cto.com/268543/564581 首先android的selector是在drawable/xxx.xml中配置的,相关图片放在同目录下 ...

  6. javascript笔记---算法基础学习

  7. python pil 安装

    Ubuntu下 sudo pip install pil 安装PIL可能会出现问题,例如安装完成时显示JPEG support not available 或者 ZLIB (PNG/ZIP) supp ...

  8. 在ThinkPHP3.x框架中实现将原创文章第一时间推送到百度收录

    前两天自己写的一篇文章“针对BootStrap中tabs控件的美化和完善”被别的网站给转载了,这也许是值得高兴的一件事情,但是有些网站并没有注明来源和作者.而去百度搜索这篇文章,排名第一的居然是那些转 ...

  9. Responsive设计——不同设备的分辨率写法

    1.1024px显屏 @media screen and (max-width : 1024px) { /* 样式写在这里 */ } 2.800px显屏 @media screen and (max- ...

  10. 连续改变Chrome浏览器窗口大小,可以导致内存泄漏

    最近在做响应式布局的页面,在开发测试过程中,为了看到页面在不同尺寸的窗口中的表现,因此要不停的拖动浏览器来改变其窗口大小:开始在Chrome浏览器下查看页面,拖动了几次,感觉电脑明显的卡了下来,刚开没 ...