转自：http://www.cnblogs.com/hongchenok/archive/2012/11/29/2795041.html

最近在开发项目的时候，发现在火狐浏览器中设置外容器margin:0 auto是可行的。

但是到了IE6,IE7,IE8则出现了不能居中的现象。

开始也没怎么在意，刚刚在浏览网页的时候看到这篇文章，帮我解决了这个疑问。

解决方案如下：

很多人都忽略了“文档类型”。下面就是正确设置的文档类型了。

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>

另外，如果你使用的IDE是Dreamweaver，还可以通过调整页面属性来解决。该选项在菜单中的修改–>页面属性。

详细设置如下图：

Unicode 标准化表单下面的“包括Unicode签名”选项不要打钩。其他调整成如上的设置即可解决。

知识补充：

关于网页声明，参考：

HTML <!DOCTYPE> 标签

定义和用法

<!DOCTYPE> 声明位于文档中的最前面的位置，处于 <html> 标签之前。此标签可告知浏览器文档使用哪种 HTML 或XHTML 规范。

该标签可声明三种 DTD 类型，分别表示严格版本、过渡版本以及基于框架的 HTML 文档。

以下面这个 <!DOCTYPE> 标签为例：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

在上面的声明中，声明了文档的根元素是 html，它在公共标识符被定义为 "-//W3C//DTD XHTML 1.0 Strict//EN" 的 DTD 中进行了定义。浏览器将明白如何寻找匹配此公共标识符的 DTD。如果找不到，浏览器将使用公共标识符后面的 URL 作为寻找 DTD 的位置。

提示和注释：

注释：<!DOCTYPE> 标签没有结束标签！

HTML

HTML 4.01 规定了三种文档类型：Strict、Transitional 以及 Frameset。

HTML Strict DTD

如果您需要干净的标记，免于表现层的混乱，请使用此类型。请与层叠样式表（CSS）配合使用：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">HTML Transitional DTD

Transitional DTD 可包含 W3C 所期望移入样式表的呈现属性和元素。如果您的读者使用了不支持层叠样式表（CSS）的浏览器以至于您不得不使用 HTML 的呈现特性时，请使用此类型：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">Frameset DTD

Frameset DTD 应当被用于带有框架的文档。除 frameset 元素取代了 body 元素之外，Frameset DTD 等同于 Transitional DTD：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

XHTML

XHTML 1.0 规定了三种 XML 文档类型：Strict、Transitional 以及 Frameset。

XHTML Strict DTD

如果您需要干净的标记，免于表现层的混乱，请使用此类型。请与层叠样式表（CSS）配合使用：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML Transitional DTD

Transitional DTD 可包含 W3C 所期望移入样式表的呈现属性和元素。如果您的读者使用了不支持层叠样式表（CSS）的浏览器以至于您不得不使用 XHTML 的呈现特性时，请使用此类型：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML Frameset DTD

当您希望使用框架时，请使用此 DTD！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

如需检查你是否编写了带有正确 DTD 的合法 XHTML 文档，您可以把您的 XHTML 页面链接到一个 XHTML 验证器。

margin:0 auto在IE中失效的解决方案的更多相关文章

  1. 正确的使用margin:0 auto与body{text-align:center;}实现元素居中（转）

    body{text-align:center}与margin:0 auto的异同? text-align是用于设置或对象中文本的对齐方式.一般情况下我们设置文本对齐方式的时候需要用此属性进行设置 我们 ...

  2. html页面docutype前面出现字符会导致IE678 margin:0 auto;失效

    html页面<!DOCTYPE html>前面出现字符会导致IE678 margin:0 auto;失效

  3. css中margin:0 auto没作用

    很多初学制作网页的朋友,可能会遇到的一个常见问题,就是在CSS中加了margin:0 auto;却没有效果,不能居中的问题!margin:0 auto;的意思就是:上下边界为0,左右根据宽度自适应!其 ...

  4. CSS中设置margin:0 auto; 水平居中无效的原因分析

    很多初学制作网页的朋友,可能会遇到的一个常见问题,就是在CSS中加了margin:0 auto;却没有效果,不能居中的问题,margin:0 auto;的意思就是:上下边界为0,左右根据宽度自适应,其 ...

  5. css中元素的auto属性值是什么意思，比如margin:0 auto表示什么？

    auto 你可以理解为一种 自动/自适应 的概念 比如 现在项目需要一个宽度为960px的整体布局居中 根据用户浏览器大小不同你将需要使用margin:0 auto;来实现. 无论用户浏览器宽度为多少 ...

  6. CSS中margin: 0 auto；样式没有生效

    问题:有两个元素: A, B.两则是嵌套关系,A是B的父节点.A和B都是块元素.当在A上设置:margin: 0 auto的时候,B并没有在页面中居中. margin: 0 auto 为什么没有生效? ...

  7. css中两种居中方式text-align:center和margin:0 auto 的使用场景

    关于使用text-align:center和margin:0 auto 两种居中方式的比较 前言:最近由于要学习后端,需要提前学习一部分前端知识,补了补css知识,发现狂神在讲这一部分讲的不是特别清楚 ...

  8. 绝对定位后，position:absolute;不能使用margin: 0 auto;实现居中；

    声明: web小白的笔记,欢迎大神指点!联系QQ:1522025433. 我们都知道margin: 0 auto:可也实现块状元素的水平居中:但是对于绝对顶为的元素就会失效: 请看实例: <!d ...

  9. margin:0 auto;不居中

    margin:0 auto:不居中可能有以下两个的原因; 1.没有设置宽度<div style="margin:0 auto;"></div>看看上面的代码 ...

随机推荐

  1. 浏览器兼容 copyToClipboard("拷贝内容")

    function copyToClipboard(txt) { if (window.clipboardData) { window.clipboardData.clearData(); clipbo ...

  2. C# 代码示例_结构/数组/枚举...

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  3. Polymer.js

    Polymer 1.0 教程 安装 bower install --save Polymer/polymer

  4. Mac下到Linux主机ssh免密码登录

    最近忙得忘乎所以,写篇博客放松放松,RT,直接上命令好了 # Local ssh-keygen -t rsa scp ~/.ssh/id_rsa.pub username@server:~/.ssh/ ...

  5. Python 主成分分析PCA

    主成分分析(PCA)是一种基于变量协方差矩阵对数据进行压缩降维.去噪的有效方法,PCA的思想是将n维特征映射到k维上(k<n),这k维特征称为主元,是旧特征的线性组合,这些线性组合最大化样本方差 ...

  6. css模糊效果

    CSS代码: .blur { filter: url(blur.svg#blur); /* FireFox, Chrome, Opera */ -webkit-filter: blur(10px); ...

  7. python数据结构与算法——字典树

    class TrieTree(): def __init__(self): self.root = {} def addNode(self,str): # 树中每个结点(除根节点),包含到该结点的单词 ...

  8. MYSQL安装--小白教程

    这个是mysql的安装过程,其实mysql的安装也很简单,但是我安装了一下午!!一下午!!原因就是,我把mysql的官网都翻遍了,都没找到64bit的.msi安装包,后来才想到好像64bit的电脑可以 ...

  9. 使用response实现文件的下载

    package cn.itcast.request; import java.io.FileInputStream;import java.io.IOException;import java.io. ...

  10. Spring触发器配置Quartz

    参考文献:http://blog.csdn.net/liaq325/article/details/8269439 http://sundoctor.iteye.com/blog/441951 业务类 ...