这篇文章是为了和大家分享IE8下DIV嵌套出现错误怎么办。我觉得边肖很实用,就和大家分享一下作为参考。让我们跟着边肖看一看。
IE8下DIV嵌套出现错误解决方案
最近用DIV写了几个网页。一开始,我从未在IE8下测试过。最近升级了IE8,发现很多问题。一开始出现了IE6和IE7没有发现的新问题,大概是以下三种方法。分享给大家!
dividdivid=" a1Primedividdivid=" b1Prime/div dividevid=" B2Prime;/div/div当b1和b2都是float=left时,a1层的高度不会被b1和b2的高度扩展。(这种现象只发生在IE8,其他版本的IE和IE8选择兼容模式后没有问题。)
解决方案:显示=a1的表格
=================================
不同的浏览器在CSS解析上可能会有差异,所以在IE6和IE7中可以正常显示的CSS DIV页面在IE8和FF(火狐)浏览器中可能不正常,需要特别注意。下面的代码在FF和IE8下无法正常显示DIV块的内容,只有一条两像素高的红线(其实是上下边框被挤在一起的结果)mdashmdash
CSS:
# main { margin:auto宽度width:400px背景色: # 336699;border:1pxsolid # ff0000} DIV : divid divid=' main '/div ie8和div在FF浏览环境中的嵌套效果:
这意味着当我们将main作为DIV的父层,并且DIV的几个子层嵌套在其中时,父层的样式将被忽略或根本无效,这可能会导致严重的问题。我们必须找出原因。原来在IE8和FF环境下,不会显示没有内容、高度未定义的DIV。在上面的代码中,如果我们给main定义一个高度,或者把divide=' main '/div改成divide=' main ' hello/div,那么在IE8和FF下预设效果会正常显示。
嵌套DIV之后情形又如何呢?
IE8和FF是否将层中的DIV视为实体HTML元素?现在让我们试试DIV嵌套效果:
CSS:
# main { margin:auto宽度width:400px背景色: # 336699;border:1pxsolid # ff0000} # sub { width:200px背景-color : # AAA;float:left} div : dividdid=' main ' dividdid=' sub ' hello world!br/HiGod!IE8和FF下的/div/div嵌套效果如下图所示:
显然,id main的父DIV嵌套不被id sub的内部子DIV支持,整体风格严重扭曲。一个简单的方法就是在* * * a子层DIV结束后添加一个高度为0像素的DIV,DIV不允许两边都有浮动对象:
dividevid=' main ' dividevid=' sub ' hello world!br/HiGod!br/OK?/div style div style=' height :0 px;clear:both'第二个解决方案是定义一个CSS类:
{ content : }后的. box :显示:块;height:0pxclear:both可见性:隐藏;}然后将父div代码中的DIVid=' main '更改为divid='main' class=' box '。
以上两种方法会产生DIV嵌套效果,如下图所示:
感谢阅读!这篇关于“IE8下DIV嵌套出现错误怎么办”的文章就分享到这里了,希望。
内容来源网络,如有侵权,联系删除,本文地址:https://www.230890.com/zhan/73735.html