IE8下DIV嵌套出现错误怎么办

技术IE8下DIV嵌套出现错误怎么办这篇文章给大家分享的是有关IE8下DIV嵌套出现错误怎么办的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。IE8下DIV嵌套出现错误解决方案最近用DIV写了几

这篇文章是为了和大家分享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浏览环境中的嵌套效果:

IE8下DIV嵌套出现错误怎么办

这意味着当我们将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嵌套效果如下图所示:

IE8下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嵌套出现错误怎么办

感谢阅读!这篇关于“IE8下DIV嵌套出现错误怎么办”的文章就分享到这里了,希望。

内容来源网络,如有侵权,联系删除,本文地址:https://www.230890.com/zhan/73735.html

(0)

相关推荐

  • Windows中kafka zookeeper安装

    技术Windows中kafka zookeeper安装 Windows中kafka zookeeper安装Windows中kafka安装步骤 https://blog.csdn.net/qq_43641

    礼包 2021年12月1日
  • mysql设置字段为varchar(mysql怎么把varchar改类型)

    技术mysql如何转换varchar这篇文章主要介绍了mysql如何转换varchar,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

    攻略 2021年12月16日
  • react中的flux是什么

    技术react中的flux是什么本篇内容主要讲解“react中的flux是什么”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“react中的flux是什么”吧!

    攻略 2021年11月24日
  • qt画切片地图(qt 地图演示)

    技术Qt编写地图综合应用之如何绘制雨量分布这篇文章主要介绍Qt编写地图综合应用之如何绘制雨量分布,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!一、前言雨量分布图是在区域地图基础上,针对区域中的每个

    攻略 2021年12月25日
  • 文与可,文财神和武财神可以一起供奉吗

    技术文与可,文财神和武财神可以一起供奉吗文武财神是绝对不可以放在一起供奉的。民间供奉文财神的讲究:一文与可、文财神一定要供奉在吉位供奉文财神,一定要选择家中的吉位。自己无法确定的话,最好请专家老师实地勘察,或者根据户型图

    生活 2021年10月26日
  • 一堂好课的标准是什么,怎么上课才算是成功的一堂课

    技术一堂好课的标准是什么,怎么上课才算是成功的一堂课成功的一堂课就是师生互感满意的课堂并且符合评课的各个标准一堂好课的标准是什么!一、从老师的角度来说这一节课,老师感觉自己要讲的内容都很好的呈现出来。这一节课,老师感觉学

    生活 2021年10月25日