`

IE6下select标签覆盖div的完美解决办法

    博客分类：
  • CSS
ie6bug 
阅读更多
在上一家公司做网站的时候遇到一个问题，IE6下select标签覆盖div的问题。

虽然很多人很讨厌IE6，但是IE6.0还是有很多用户，特别是前端设计人员，很多Bug让人很纠结，关于IE6下select标签覆盖div的问题，现在已经有完美解决办法

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<title>IE6下select标签覆盖div的解决办法</title> 
</head> 
<body> 
<div style="position:absolute;background:red;width:200px;left:20px;top:20px;"> 

<!--[if IE 6]><iframe style="position:absolute;width:100%; height:100%;_filter:alpha(opacity=0);opacity=0;border-style:none;"></iframe><![endif]-->
IE6下select标签覆盖div的解决办法<br>
可能由于下拉列表控件的弹出式下拉列表的原因导致Z轴高度失控。但是IE6有一个神奇的逻辑，div 无法覆盖select,但是iframe 可以覆盖select，而div可以覆盖iframe，所以解决办法就是用Z轴高度更高的Iframe元素，包裹或覆盖住下拉列表框控件，使其回到正常的 Z轴高度上来！
</div> 
<select><option>内容终于被盖住</option></select> 
IE6下select标签覆盖div的解决办法      
</body> 
</html>
分享到：
| Javascript跨域问题
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    ie6下select覆盖div的解决办法

    总的来说，解决IE6下的Select覆盖Div问题需要根据实际情况灵活运用上述方法。在现代浏览器广泛使用的今天，虽然IE6的市场份额已经非常小，但考虑到部分用户可能还在使用，开发者仍需关注此类兼容性问题。在解决这类...

    解决IE6 中select 穿透 div 等层的问题

    在互联网的早期，Internet Explorer 6 (简称IE6) 是一款广泛应用的浏览器，但它的兼容性和渲染机制存在诸多问题，其中一个问题就是“select穿透div”的现象。这个问题在现代浏览器中通常不会出现，但在IE6中，`...

    ie6下select遮挡div

    标题“ie6下select遮挡div”指出的是一个典型的IE6特有的问题：当在网页上使用select下拉框时，它会覆盖在其他使用绝对或相对定位的元素（如div）之上，导致这些元素无法正常显示。这个问题对于设计美观且交互性强的...

    完美解决IE6下select控件样式

    "完美解决IE6下select控件样式"的资源针对的就是这个历史悠久的问题。Select控件是HTML中用于创建下拉菜单的元素，但在不同的浏览器中，其默认样式可能会有很大差异，特别是对于IE6，它的呈现效果通常不符合现代网页...

    解决IE6中 Div层挡不住Select组件

    "解决IE6中 Div层挡不住Select组件"这个问题是一个典型的例子，它反映了IE6在CSS层叠样式和Z-index处理上的独特行为。 在现代浏览器中，我们可以利用CSS的`z-index`属性来控制元素的前后堆叠顺序，从而让某些元素...

    ie6下DIV覆盖select框js解决代码

    总结来说，解决IE6下`div`覆盖`select`框的问题需要理解浏览器的层叠上下文规则，并利用JavaScript动态调整元素的样式。虽然这种问题在现代浏览器中很少出现，但在维护旧项目或考虑跨浏览器兼容性时，理解并掌握这种...

    IE6下Select元素被div等元素覆盖的解决办法

    在IE6浏览器中，一个常见的布局问题是下拉选择框（select元素）在使用div元素制作蒙版或弹出层时会被覆盖，即使给div设置了更高的z-index也无法解决。此问题的根本原因在于IE6对z-index属性的解释与其它浏览器不同，...

    解决 Ie 6下 select挡住div的通用函数

    /** * 让iframe 显示在 指定的div下面 针对ie6 select挡住div 的bug 采用 iframe来当作div的底 * * @param string divId 需要解决的div层 * @param string iframeId 采用的 IFRAME ,如果不指定 自动...

    IE6中select标签的option不能disabled的解决方案

    在早期的Internet Explorer 6（简称IE6）浏览器中，存在一个众所周知的兼容性问题：`&lt;select&gt;`标签内的`&lt;option&gt;`元素无法正确地应用`disabled`属性。这个问题使得开发者无法在IE6中实现禁用某些选项的功能，这对于...

    用div+jq高仿ie6的select表单随内容增加-2012-11-1

    用div+jq高仿ie6的select表单随内容增加 进行了一个升级，将其做成一个类似插件的形式； 在html中，依旧是应用传统的select进行布局，只需要给select一个class为toDiv，就可以动态的将select替换为已经设置好了的div...

    让div浮动在select之上的完美解决方案！多浏览器兼容

    综上所述，实现"让div浮动在select之上的完美解决方案"涉及CSS的`z-index`、`position`属性，以及对IE6/7的特殊处理。通过这些技术，我们可以创建出既美观又具有良好兼容性的网页布局。记得在实际项目中进行充分的跨...

    解决div总是被select遮挡的问题.rar

    在某些情况下，可能需要进一步调整`z-index`或者尝试其他解决方案，比如用JavaScript或jQuery监听`select`元素的显示和隐藏，动态调整`div`的`z-index`。 总的来说，解决`div`被`select`遮挡的问题需要对CSS的堆叠...

    致WEB前端开发者:IE6-IE11兼容性问题列表及解决办法

    3. SELECT 元素覆盖问题：IE6-IE7 中存在 SELECT 元素不能被 div 覆盖的问题。解决办法是，使用 position 属性来解决这个问题。 4. CSS 样式大小写敏感：IE6-IE7 中 CSS 样式区分大小写。解决办法是，确保所有 CSS ...

    div 模拟select 单选

    select 在ie6下覆盖div bug 解决方案。 div 模拟select 单选 在 body onload事件中调用init_select方法就可，参数传相关背景图片就可。我都已经放到资源包下了。

    Div 制作的SELECT

    用DIV模仿SELECT下拉框 function replaceSelects() { try{ for (i=0;i;i++){ // 隐藏 select selects[i].style.display = 'none'; select_divTag = document.createElement('div'); select_divTag.id = ...

    DIV+select美化支持IE6 IE7 火狐（门户搜索）觉得兼容

    标题中的“DIV+select美化支持IE6 IE7 火狐（门户搜索）觉得兼容”指的是一项网页设计技术，主要是针对HTML中的`&lt;div&gt;`元素和`&lt;select&gt;`下拉菜单进行美化，并确保在不同浏览器，特别是老旧的Internet Explorer（IE6...

    select ——使用DIV 实现 Select

    select ——使用DIV 实现 Select js源码

    IE6下div层被select控件遮住的问题解决方法

    在互联网的早期，尤其是IE6浏览器占据主导地位的时代，开发者们常常会遇到一个棘手的问题：在页面上，当一个`div`层位于`select`下拉框之上时，`select`控件会穿透`div`层显示出来，导致设计效果无法正常展现。...

    ie6弹出框被select遮住解决办法

    ie6弹出框被select遮住解决办法. 只要很简单的操作就可以实现，兼容IE6，IE7，IE8，FF |

Magicbox
Global site tag (gtag.js) - Google Analytics