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)

相关推荐

  • javaScript如何实现复制粘贴功能

    技术javaScript如何实现复制粘贴功能小编给大家分享一下javaScript如何实现复制粘贴功能,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一

    攻略 2021年11月18日
  • 怎么编写Linux内核模块HelloWorld

    技术怎么编写Linux内核模块HelloWorld本篇内容介绍了“怎么编写Linux内核模块HelloWorld”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情

    攻略 2021年11月30日
  • 2021.50 Quarkus

    技术2021.50 Quarkus 2021.50 Quarkus2018年的一次内部会议上,红帽中间件副总裁Mark Little说,他最担心的是一种新的编程语言(如go)能给用户提供更快的运行速度及

    礼包 2021年12月20日
  • 如何进行MySQL表结构的导入和导出

    技术如何进行MySQL表结构的导入和导出本篇文章给大家分享的是有关如何进行MySQL表结构的导入和导出,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。MySQ

    攻略 2021年10月25日
  • 金柝,一腔热血换来失望的诗句

    技术金柝,一腔热血换来失望的诗句1、朝来入庭树,孤客最先闻金柝。——刘禹锡《秋风引》2、过尽千帆皆不是,斜晖脉脉水悠悠,肠断白频洲。——温庭筠《梦江南》3、渐行渐远渐无书,自此山水不相逢。——欧阳修《木兰花》
    4、无人收

    生活 2021年10月27日
  • 详解NLP

    技术详解NLP本篇内容介绍了“详解NLP”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!处理数据实验中使用的数据或文本语料

    攻略 2021年11月6日