很多初学制作网页的朋友，可能会遇到的一个常见问题，就是在CSS中加了margin:0 auto;却没有效果，不能居中的问题！margin:0 auto;的意思就是：上下边界为0，左右根据宽度自适应！其实就是~~水平居中的意思。下面我就列举集中居中没作用的情况：

1：没有设置宽度。margin:0 auto居中是要设置宽度滴。

2：没声明DOCTYPE：
DOCTYPE是document type（文档类型）的简写，在web设计中用来说明你用的XHTML或者HTML是什么版本。要建立符合标准的网页，DOCTYPE声明是必不可少的关键组成部分！当然现在很多web编辑器都会自动声明doctype。（不要告诉我你还在用文本编辑器。。。）

3：margin：0 auto 是对块级元素才起作用的。有可能你是对行内元素（比如<a><span><input>等)居中，这时候给它的display：block | inline-block，然后添加宽度就ok了哦。

4:将此元素添加了浮动或者定位：它通常只对静态元素（无浮动、无定位）起作用

浮动：脱离当前的文档流，变换到容器的边缘，或是另一个浮动box的边缘，若空间不够则向下移动直到可以放下

css中margin:0 auto没作用的更多相关文章

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

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

  2. CSS样式margin:0 auto不居中

    <style type="text/css">html,body{height:100%;width:960px;}.container{background-colo ...

  3. CSS中margin：auto什么意思？margin：auto属性的用法详解

    我们都知道使用margin:auto可以让元素水平居中的.但你有没有想过使用margin:auto可以让元素水平居中的原因,要回答这个问题,我们首先需要看一下margin:auto的工作原理.auto ...

  4. 网页CSS中*{margin:0; padding:0;}有什么用

    * 这东西叫“通配符”用来匹配页面上所有元素.*{margin:0; padding:0;} 像 2L 所说,body ,ul, li ,p,h1~h6,dd,dt 等……都有默认的margin 或p ...

  5. IE下margin:0 auto为什么不居中？

    http://blog.sina.com.cn/s/blog_68c6be330101k7kn.html 我们经常用DIV+CSS布局网页的时候,正常情况下需要将div居中显示时,使用Css样式:ma ...

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

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

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

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

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

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

  9. margin:0 auto在IE中失效的解决方案

    转自:http://www.cnblogs.com/hongchenok/archive/2012/11/29/2795041.html 最近在开发项目的时候,发现在火狐浏览器中设置外容器margin ...

随机推荐

  1. 【转】[Algorithm]01分数规划

    因为搜索关于CFRound277.5E题的题解时发现了这篇文章,很多地方都有值得借鉴的东西,因此转了过来 原文:http://www.cnblogs.com/perseawe/archive/2012 ...

  2. LA 6449 IQ Test

    [题目] 给出一个长度为n的数组(8<n<12),告诉你规律  (1<=d<=3)要求d尽量小 现在求第n+1项 [题解] 水题 不知道怎么求a1~ad? 用克拉默法则 [代码 ...

  3. cogs 1008 贪婪大陆

    /* 不要思维定视 盯着线段树维护l r 的ans不放 显然没法区间合并 换一种思路 如果打暴力的话 O(nm) 每次询问 扫一遍之前所有的修改 有交点则说明种数++ 接下来考虑如何优化 我们把每个区 ...

  4. 《fullPage.js》创建全屏滚动的网站

    插件介绍 fullPage.js是一个简单易用的插件,创建全屏滚动的网站(也被称为单页网站).它允许全屏滚动创建网站,以及添加内部滑块. 浏览器兼容性 主要功能 支持鼠标滚动 支持前进后退和键盘控制 ...

  5. css动画+照片清晰度动画

    源代码: <!DOCTYPE html><html><head> <title>donghua</title> <meta chars ...

  6. 关于.net类型转换判断问题

    做项目时,发现这个问题,由于数据库中的字段可能为null,如果在.net程序直接转换时,比如 ltTime.Text =DateTime.Parse(dt.Rows[0]["m_Time&q ...

  7. SQL从入门到基础 - 04 SQLServer基础2（数据删除、数据检索、数据汇总、数据排序、通配符过滤、空值处理、多值匹配）

    一.数据删除 1. 删除表中全部数据:Delete from T_Person. 2. Delete 只是删除数据,表还在,和Drop Table(数据和表全部删除)不同. 3. Delete 也可以 ...

  8. C# 截取字符串，区分中英文情况

    public static string SubstringByCN(string strInput, int begin, int length) { if (!Regex.IsMatch(strI ...

  9. 使用SOCKET TCP

    刚刚接触SOCKET编程,网上看了一些资料,发现做些简单的应用还是不难.但是要深入了解SOCKET编程还需要系统的看一些书.一般在进程间通信TCP是一种不错的方式. ---XXX TCP链接是面向流的 ...

  10. 使用HTML5 API(AudioContext)实现可视化频谱效果

    如今的HTML5技术正让网页变得越来越强大,通过其Canvas标签与AudioContext对象可以轻松实现之前在Flash或Native App中才能实现的频谱指示器的功能. Demo: Cyand ...