zoukankan      html  css  js  c++  java
  • a标签点击跳转失效--IE6、7的奇葩bug

    一般运用a标签包含img去实现点击图片跳转的功能,这是前端经常要用到的东西。

    今天遇到个神奇的bug:如果在img上再包裹一层div,而且div设置了width和height,则图片区域点击时,无任何响应。

    出现这个bug的条件是:1.a标签下包含div这样的块元素
               2.块元素必须设置width和height属性值

               3.该块元素下包含img

    解决方法:改结构或者让三个条件的某一个失效就可以了

    2015-05-22 补充

    1.就算将a标签设置为display:block;也同样失效
    2.只要不在img覆盖的区域,a标签点击还是有效的
    3.之所以这样用,是想更多地以取巧的方式,利用a标签的默认功能,实现简单的跳转,而不用写多余的js代码
    4.可以利用:hover伪类,进行样式的切换(这在低版本浏览器下,是最高效,直接的方式)
    5.在高级浏览器,将a标签display:block;,从意义上来说,不存在太大的问题(当然,裸css还是相当的惨)

  • 相关阅读:
    mongoDB安装配置
    linux-批量修改目录下后缀shell
    备份mysql的shell
    mysql_DML_索引、视图
    mysql_存储过程
    mysql_备份_mysqldump
    mysql_DCL_grant/revoke
    mysql_DML_select_子查询
    mysql_DML_select_union
    mysql_DML_select_聚合join
  • 原文地址:https://www.cnblogs.com/walls/p/4500952.html
Copyright © 2011-2022 走看看