zoukankan      html  css  js  c++  java
  • 拦路虎 (2016-6-22) 下拉菜单问题

    问题描述:下拉菜单出现后无法点击,设置下拉菜单框威absolute定位后,可以点击,但会撑开父容器!   真日了狗了!

                        使用position很容易出现层叠问题;所以注意设置z-index! 

                    怕出错,就为position:absolute的元素的父元素设置position:relative吧!    z-index属性也是要参照父级position元素的。

    解决方案:

    1.要知道是在谁上面hover!  是在父包含框哦! 不是同级的元素。   (妈的,W3C上的不准?)

    2.外层设置相对定位,并设置z-index属性, 下拉菜单设置绝对定位。   在下拉菜单元素上设置z-index是无效的!

       应该是导航条和下拉菜单是一体的,拥有一样的z-index值, 下边的内容块覆盖了导航条中的下拉菜单,但没有覆盖出发下拉菜单的按钮。

       所以下拉菜单中的各项可以看到但无法点击哦!    遇到z-index问题可以设置背景色来试试!

       现象:将下拉菜单的position属性设置为relative后,因为没有脱离文档流,所以没有出现层叠现象。  内容显示的时候会撑开下面的元素!    但设置为

                  absolute就会出现层叠问题哦!

       漏洞:相对定位到底有没有脱离文档流呢?           没有脱离,只有设置了定位后才会脱离!

                   别忘了css的inherit

                   position:fixed,relative,absolute都可以作为position参照物。

      现象: 设置了position:absolute后,块状元素变为行内块元素。 

  • 相关阅读:
    ubuntu 14.04 安装python包psycopg2
    vmare 往 virtualbox迁移
    docker-compose & docker 镜像/加速
    nodejs & npm & gulp 安装和配置
    airflow 优化
    airflow 部署
    windows 上vmare超卡的问题解决方案
    HDU 6781 Solo (贪心 + 优先队列)
    HDU 6779 Drink (最小费用流)
    HDU 6778 Car (状压DP)
  • 原文地址:https://www.cnblogs.com/njqa/p/5642355.html
Copyright © 2011-2022 走看看