ie下margin不居中的三种解决方法

(编辑:jimmy 日期: 2024/10/31 浏览:2)

正常情况下需要将div居中显示时,使用Css样式:margin:0 auto即可,但有时使用margin:0 auto后在FF、Chrome里能居中,而在IE678里不居中的现象。

如下代码:

复制代码代码如下:
<style type="text/css">
#con{width:980px;martin:0 auto;}
</style>
<div id="con">margin: 0 auto 内容居中显示</div>

解决方法一
可以是对网页主体<body>声明文本居中,即body{text-align:center}
即:

复制代码代码如下:
<style type="text/css">
body{text-align:center}
#con{width:980px;martin:0 auto;}
</style>
<div id="con">margin: 0 auto 内容居中显示</div>

解决方法二
其实和解决方法一差不多,只是在要居中的div外层添加多一个div,并使其居中
即:

复制代码代码如下:
<style type="text/css">
#con{width:980px;martin:0 auto;}
</style>
<div style=“text-align:center”><div id="con">margin: 0 auto 内容居中显示</div></div>

解决方法三
出现这个现象的原因在于文档的DTD声明;
修改DTD为

复制代码代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">

一句话新闻

高通与谷歌联手!首款骁龙PC优化Chrome浏览器发布
高通和谷歌日前宣布,推出首次面向搭载骁龙的Windows PC的优化版Chrome浏览器。
在对骁龙X Elite参考设计的初步测试中,全新的Chrome浏览器在Speedometer 2.1基准测试中实现了显著的性能提升。
预计在2024年年中之前,搭载骁龙X Elite计算平台的PC将面世。该浏览器的提前问世,有助于骁龙PC问世就获得满血表现。
谷歌高级副总裁Hiroshi Lockheimer表示,此次与高通的合作将有助于确保Chrome用户在当前ARM兼容的PC上获得最佳的浏览体验。