很多初学制作网页的朋友,可能会遇到的一个常见问题,就是在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. Android项目中如何用好构建神器Gradle?(转)

    最近在忙团队并行开发的事情,主要是将各个团队的代码分库,一方面可以降低耦合,为后面模块插件化做铺垫,另一方面采用二进制编译,可以加快编译速度.分库遇到了一些问题,很多都要通过Gradle脚本解决,所以 ...

  2. 6、第六课,js jquery20150928

    1.声明事件,给事件添加动作 function MyClick() { alert("这是我的第一个js") } 2.js特点 A.js区分大小写 B.弱类型变量,定义一个变量 v ...

  3. css3 3D变换和动画

    3D变换和动画 建立3D空间,transform-style: preserve-3d perspective: 100px; 景深 perspective-origin:center center ...

  4. mongodb的副本集总结

    主节点A.备份节点B.仲裁者C.是否真的需求仲裁者? 需要. 怎样才算大多数表格如下: 怎样才算大多数表格 副本集中的成员总数 副本集中的大多数 1 1 2 2 3 2 4 3 5 3 6 4 7 4 ...

  5. Hadoop源码解析之 rpc通信 client到server通信

    rpc是Hadoop分布式底层通信的基础,无论是client和namenode,namenode和datanode,以及yarn新框架之间的通信模式等等都是采用的rpc方式. 下面我们来概要分析一下H ...

  6. 使用DML语句【weber出品必属精品】

    DML语句包含以下语法: INSERT:往一个表中增加新行 DELETE:从一个表中删除掉现有的行 UPDATE:更改一个表中现有的行 INSERT语句语法:INSERT INTO TABLE(COL ...

  7. Asp.net Repeater控件

    Repeater控件和DataList控件,可以用来一次显示一组数据项.比如,可以用它们显示一个数据表中的所有行.     Repeater控件完全由模板驱动,提供了最大的灵活性,可以任意设置它的输出 ...

  8. Java学习笔记(1):注释规范

    注释规范 1.   类注释 在每个类前面必须加上类注释,注释模板如下: 2.   属性注释 在每个属性前面必须加上属性注释,注释模板如下: 3.   方法注释 在每个方法前面必须加上方法注释,注释模板 ...

  9. STL 之 空间配置器(allocator)

    一.SGI 标准的空间配置器,std::allocator SGI也定义了一个符合部分标准,名为allocator的配置器,但是它自己不使用,也不建议我们使用,主要原因是效率不佳. 它只是把C++的操 ...

  10. jsp页面间的传值

    很多的时候我们只是把我们需要的数据,查询出来,然后用request.setAttribute("" ,"" )方法保存这个数据集合.再在我们能跳转到的下一个js ...