新闻中心

解决帝国cms在IE6中层被下拉框盖住解决方法

作者 / 无忧主机时间 2014-08-24 18:21:56

在网页中，每个属于自己程序都有自己默认层级定义，就因为这个原因有些元素才有显示层次的区分，在某些时候可以利用css的z-index属性来改变元素的默认关系，到最后由于不同的浏览器层次的关系不同就会造成浏览器的显示分开，有些人认为都是浏览器关系或者是模板的问题去修改，一般出现在比如IE6、IE7和Firefox之间，所以小编今天找了很多资料去想办法修改这些东西，达到一致的效果常见的层级bug有层被下拉框盖住的bug、flash文件始终在最顶层等等很多，无忧小编先讲解下如何解决IE6中层被下拉框盖住的方法E6中层被下拉框盖住是什么样子的很多站长朋友都在怀疑有字无图说半天都是多余。下面是无忧小编截图： [caption id="attachment_15913" align="alignnone" width="297"] 帝国截图[/caption] 以上的截图代码如下：小编都提供给大家看下 <div id="tags_box" style="position:absolute;top:20px;left:100px;width:210px; height:110px;z-index:999;border:1px solid #1d95c7;background:#f0f9fb;padding:5px;"> <p><b>推荐标签</b></p> <p> <a href="###">西藏</a> <a href="###">动漫</a> <a href="###">35mm</a> <a href="###">足球</a> <a href="###">壁纸</a> <a href="###">汽车</a><br /> <a href="###">数码</a> <a href="###">夏天</a> <a href="###">偶像</a> <a href="###">清纯</a> <a href="###">婚纱</a> <a href="###">5D</a><br /> <a href="###">服饰</a> <a href="###">电影</a> <a href="###">lomo</a> <a href="###">搞笑</a> <a href="###">造型</a> <a href="###">黑白</a><br /> <a href="###">香港</a> <a href="###">建筑</a> <a href="###">艺术</a> <a href="###">幽默</a> <a href="###">快乐</a> <a href="###">MM</a> </p> </div> <br /> <br /> <br /> <form id="form2" name="form2" method="post" action=""> <span>选择专辑：</span> <select name="select2"> <option>默认专辑</option> <option selected="selected">自建专辑名</option> </select>　 </form> 喜欢研究的朋友可以试着把代码粘贴到网站中，使用IE7和360以及Firefox浏览器查看根本一点样子都不会变，但是接下来小编使用IE6的时候效果却大大的打折扣，完全不一样了选择框的下拉菜单遮挡住，其实造成这个原因IE6选择框默认为最高层，所以将tags_box盖住。想解决这个问题需要改变z-index的值是达不到效果的但是，可以找到和选择下拉框同样被IE6误认为最高等级的另一元素——iframe解决它。方法是在tags_box这个div中插入一个iframe，并让它的的透明度为0，看起来不存在一样。添加代码如下： <div style="position:absolute;z-index:-1;left:-1px;top:0;width:200px;"> <iframe style="background:#F0F9FB;width:100%;height:110px;filter:alpha(opacity=0);-moz-opacity:0"></iframe> </div> 解决这个问题的办法只需要把以上的代码复制到tags_box的div里面就可以好了，之后刷新网页或者清理下浏览器的缓存就OK 能解决了！无忧主机相关文章推荐阅读：帝国CMS建站：如何增加广告信息帝国商城系列——如何配置店铺购买流程及部分参数在帝国ECMS中首页注册会员时如何去掉“选择注册会员类型”的解决方案数据缓存问题导致帝国CMS更新数据提示“INTERNET SERVER ERROR ”