IT猫扑网：您身边最放心的安全下载站！ 最新更新|软件分类|软件专题|手机版|论坛转贴|软件发布

您当前所在位置：首页 → 网络编程 → DIVCSS → IE中怎么会出现双倍边距？-DivCSS教程

IE中怎么会出现双倍边距？-DivCSS教程

时间：2015/6/28来源：IT猫扑网作者：网管联盟我要评论(0)

　　IE6.0环境中双倍边距BUG。先看下面的CSS代码。

div {
float:left;
margin-left:10px;
width:420px;
height:150px;
border:1px solid red
}

　　这样设置以后。本来左边距设置为10px，但IE6.0解释为20px，这是一个比较头疼的问题。
　　但解决也非常简单。办法就是是加上display:inline。就搞定了。看下面的示例对比！
　　双陪边距的效果：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>www.itmop.com</title>
<style type="text/css">
body {
margin:0
}
div {
float:left;
margin-left:10px;
width:420px;
height:150px;
border:1px solid red
}
</style>
</head>
<body>
<div>
Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />
</div>
</body>
</html>

　　解决BUG以后的效果：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>www.itmop.com</title>
<style type="text/css">
body {
margin:0
}
div {
float:left;
margin-left:10px;
display:inline;
width:420px;
height:150px;
border:1px solid red
}
</style>
</head>
<body>
<div>
Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />Div CSS XHTML XML 教程大全<br />
</div>
</body>
</html>

关键词标签：教程,怎么,出现,XHTML

相关阅读

文章评论
发表评论

热门文章 DIV+CSS网页布局常用的一些基础知识整理DIV+CSS网页布局常用的一些基础知识整理

相关下载

人气排行 DIV CSS完美兼容IE6/IE7/FF的通用方法CSS实例：list-style-type在IE与FF中奇怪的现象解析-CSS布局实例CSS实例:通过定义渐变边框给图片加阴影CSS常用技巧之一 禁止文字自动换行网页页面设计中CSS十大注意解决用CSS控制DIV居中失效的问题css div设置float后高度不能自动增加让CSS兼容IE和Firefox的技巧集合