应对ie双外边距，不使用hack

解决IE双倍外边距问题
最新推荐文章于 2025-08-23 14:04:57 发布
最新推荐文章于 2025-08-23 14:04:57 发布
阅读量64 收藏
点赞数
CC 4.0 BY-SA版权
原文链接：http://www.cnblogs.com/zuoxiaobing/p/3574920.html
本文介绍了解决Internet Explorer浏览器中浮动元素产生的双倍外边距问题的方法：通过在浮动元素内部添加一层div或者利用非浮动元素的外边距进行布局调整。

1.在浮动元素内层加一层div

2.使用不浮动的内层外边距来定义距离

ie在浮动时，并且使用外边距，会产生双倍外边距。

转载于:https://www.cnblogs.com/zuoxiaobing/p/3574920.html

IE浏览器兼容问题 （1）IE6的双倍外边距bug
GTX2077的博客
08-10 372
这里写自定义目录标题IE浏览器兼容问题 （1）IE6的双倍外边距bug例子解决方法 IE浏览器兼容问题 （1）IE6的双倍外边距bug 在IE6中，当为一个向左浮动的元素设置左外边距，或者为一个向右浮动的元素设置右外边距时，这个外边距将会是设置的值得2倍。 例子 1.设置一个块元素为高宽100px的红色正方体。 <!doctype html> <html> <head> <meta charset="utf-8"> <title>Ie6的双倍外边距
margin值在IE6变成双倍
11-04
标题中的“margin值在IE6变成双倍”指的是在Internet Explorer 6（简称IE6）浏览器中，当设置元素的外边距(margin)时，可能会遇到一个知名的兼容性问题，即所谓的“双边距问题”（Double Margin Bug）。这个问题主要...
在ie浏览器中，a标嵌套img标签，四周自带边距
一杯苦恰啡的博客
05-08 1463
给img标签设置如下属性即可解决。img{ border:0; }
那些与 IE 相伴的日子
前端劝退师
03-24 161
????这是第91篇不掺水的原创，想要了解更多，请戳上方蓝色字体：政采云前端团队关注我们吧～前言Internet Explorer（简称：IE）是 微软公司 (https://b...
《苏沈小雨全集》：CSS滤镜、IE特性和前端开发手册
weixin_30299319的博客
08-23 360
在Web开发的历史长河中，微软的Internet Explorer（IE）浏览器扮演了举足轻重的角色。由于IE早期版本的广泛使用，开发者不得不针对该浏览器的特殊行为进行优化。IE浏览器的默认行为，是指该浏览器在解析和渲染网页时所采取的特定行为模式，这通常与W3C推荐的标准存在差异。例如，IE6及更早版本中的盒模型默认行为就是典型的例子。IE6使用的是”怪异盒模型”（Quirks Mode），其中元素的宽度和高度包括了边框和内边距，而W3C标准的盒模型则不包括这些。
立即收藏！2019前端工程师如何应对裁员潮？
聚风阁
01-10 1134
前言 2019互联网寒冬已至，大批互联网公司纷纷裁员，其实从2018年下半年开始，裁员和市场部收缩预算就经常被提及，阿里巴巴，华为都传出了收缩招聘的新闻。网易的游戏部门和门户部门也先后裁员，趣店裁员90%，斗鱼裁员30%。小肆也是被这些消息吓得瑟瑟发抖，不过生活就是这样，谁也无法预料到第二天会发生什么，只有把握好现在，积极为未知的明天做好准备才是正道。 这里小肆给大家几点建议： 对于目前在职的同学...
14万字面试题汇总整理，祝你顺利斩获大厂前端offer
热门推荐
孙叫兽的博客
07-17 1万+
Doctype的作用? 严格模式和混杂模式的区分，以及如何触发这2种模式? <!DOCTYPE>声明位于文档中的最前面，处于<html>标签之前。告知浏览器的解析器，用什么文档类型规范来解析这个文档。 DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。 严格模式就是浏览器根据web标准去解析页面，是—种要求严格的DTD(Document Type Definition)，不允许使用任何表现层的语法， 混杂模式是—种向后兼容的解析方法。 触发标准模式或者说严格模...
前端面试易考知识点
shuo1992的博客
02-17 1609
一.HTML/CSS部分 1.什么是盒子模型？ 盒模型包括内容（content)、内边距（padding）、边框（border）、外边距（margin）。盒模型分为IE标准的盒模型以及W3C标准的盒模型，IE盒模型的content部分包含了border和padding。补充：标准W3C模型：盒子的总宽度=左右margin+左右border+左右padding+width(内容content);
前端开发者一定要会的知识点2
zhy0509的博客
08-22 366
CSS **介绍一下标准的CSS盒子模型？低版本IE的盒子模型有什么不同的？ （1）有两种，IE盒子模型、W3C盒子模型； （2）盒模型：内容（content）、填充（padding）、边界（margin）、边框（boeder） （3）区别：IE的content部分把border和padding计算了进去； **CSS选择符有哪些？哪些属性可以继承？   （1）选择符 id选择器（...
IE6的双倍边距和火狐自适应高度
08-22
在CSS布局中，有时会遇到一个奇怪的现象：当设置了某个元素（如`<div>`）的左侧外边距（`margin-left`）为10像素时，在IE6下该外边距却显示为20像素。这种现象被称为“IE6双倍边距BUG”。 **示例代码：** ```css ...
CSS DIV教程IE6，IE7ie8火狐兼容性
10-28
在IE6中，存在一个著名的双倍边距bug，当一个元素左侧浮动且有左外边距时，其实际边距会是设置值的两倍。要修复这个bug，可以使用`*html`或`_margin` hack，或者使用`display: inline-block;`来替代浮动。 通过以上...
css浏览器兼容整理
03-02
- 浮动元素的外边距在某些浏览器中可能会加倍。可以使用`clear:both;`或`display:inline-block;`来避免这一问题。 2. **DIV浮动IE文本产生3象素的bug** - 这个问题出现在IE6和IE7中。可以通过使用`zoom:1;`和`...
前端面试汇总
CheriePan的博客
11-20 1160
协议 子域名 主域名 端口号 资源同源策略是浏览器的核心，如果没有这个策略就会遭受网络攻击主要指的就是协议+域名+端口号三者一致，若其中一个不一样则不是同源，会产生跨域三个允许跨域加载资源的标签：img link script跨域是可以发送请求，后端也会正常返回结果，只不过这个结果被浏览器拦截了！JSONPCORSwebsocket反向代理。
前端噩梦：IE常见Bug修复攻略
在IE6及更低版本中，当一个元素同时设置`float`和同方向的`margin`时，会出现元素的外边距被加倍的错误。例如，以下CSS代码会触发该问题： ```css .demo{ background:#95cfef; border:1px solid #36f; float:...
优化算法基于四则运算的算术优化算法原理与Python实现：面向图像分割的全局寻优方法研究
最新发布
09-06
内容概要：本文系统介绍了算术优化算法（AOA）的基本原理、核心思想及Python实现方法，并通过图像分割的实际案例展示了其应用价值。AOA是一种基于种群的元启发式算法，其核心思想来源于四则运算，利用乘除运算进行全局勘探，加减运算进行局部开发，通过数学优化器加速函数（MOA）和数学优化概率（MOP）动态控制搜索过程，在全局探索与局部开发之间实现平衡。文章详细解析了算法的初始化、勘探与开发阶段的更新策略，并提供了完整的Python代码实现，结合Rastrigin函数进行测试验证。进一步地，以Flask框架搭建前后端分离系统，将AOA应用于图像分割任务，展示了其在实际工程中的可行性与高效性。最后，通过收敛速度、寻优精度等指标评估算法性能，并提出自适应参数调整、模型优化和并行计算等改进策略。; 适合人群：具备一定Python编程基础和优化算法基础知识的高校学生、科研人员及工程技术人员，尤其适合从事人工智能、图像处理、智能优化等领域的从业者；; 使用场景及目标：①理解元启发式算法的设计思想与实现机制；②掌握AOA在函数优化、图像分割等实际问题中的建模与求解方法；③学习如何将优化算法集成到Web系统中实现工程化应用；④为算法性能评估与改进提供实践参考； 阅读建议：建议读者结合代码逐行调试，深入理解算法流程中MOA与MOP的作用机制，尝试在不同测试函数上运行算法以观察性能差异，并可进一步扩展图像分割模块，引入更复杂的预处理或后处理技术以提升分割效果。
【微信小程序源码】图文信息；欢迎页面，音乐控制.zip
09-06
资源说明： 1：本资料仅用作交流学习参考，请切勿用于商业用途。 2：一套精品实用微信小程序源码资源，无论是入门练手还是项目复用都超实用，省去重复开发时间，让开发少走弯路！ 更多精品资源请访问 https://blog.youkuaiyun.com/ashyyyy/article/details/146464041
bedrock-testing-support-7.0.4.jar中文-英文对照文档.zip
09-06
1、压缩文件中包含： 中文-英文对照文档、jar包下载地址、Maven依赖、Gradle依赖、源代码下载地址。 2、使用方法： 解压最外层zip，再解压其中的zip包，双击 【index.html】 文件，即可用浏览器打开、进行查看。 3、特殊说明： （1）本文档为人性化翻译，精心制作，请放心使用； （2）只翻译了该翻译的内容，如：注释、说明、描述、用法讲解 等； （3）不该翻译的内容保持原样，如：类名、方法名、包名、类型、关键字、代码 等。 4、温馨提示： （1）为了防止解压后路径太长导致浏览器无法打开，推荐在解压时选择“解压到当前文件夹”（放心，自带文件夹，文件不会散落一地）； （2）有时，一套Java组件会有多个jar，所以在下载前，请仔细阅读本篇描述，以确保这就是你需要的文件。 5、本文件关键字： jar中文-英文对照文档.zip,java,jar包,Maven,第三方jar包,组件,开源组件,第三方组件,Gradle,中文API文档,手册,开发手册,使用手册,参考手册。
CSS Hack：针对IE6、IE7、IE8的解决方案
"这篇文章介绍了7个针对不同版本IE浏览器的CSS hack技巧，主要目的是解决IE6、IE7和IE8在解析CSS时存在的兼容性问题...尽管如此，理解并掌握这些经典的IE hack技巧，对于处理遗留项目或应对特定用户需求仍然很有价值。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值