很多初学制作网页的朋友,可能会遇到的一个常见问题,就是在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. VNC 黑屏

    参考资料: http://blog.sina.com.cn/s/blog_57edaf600100serf.html http://www.programgo.com/article/43581885 ...

  2. 关于apache下同IP多域名支持HTTPS和80跳转HTTPS的配置

    httpd-ssl的配置: Listen 443 NameVirtualHost *:443 AddType application/x-x509-ca-cert .crt AddType appli ...

  3. SpringMVC05使用注解的方式

    <body> <a href="add">新增</a> <a href="update">修改</a> ...

  4. 2008年NOI全国竞赛 假面舞会

    /* 分三种情况 1 有环:找环长的gcd作为max gcd的超过2的最小因子作为min 2 树:所有最长链的和作为max 3为min (最长链≥3) 3 两条相交链:找出所有的这样的两条链的差 同1 ...

  5. mongodb的地理空间索引如何在solr中体现

    "$near"是唯一一个会对查询结果进行自动排序的地理空间操作符 "$near"的返回结果是按照距离由近及远排序的.其他排序条件不会生效. 这种按照地理位置远近 ...

  6. 使用三层交换机的ACL实现不同vlan间的隔离

    使用三层交换机的ACL实现不同vlan间的隔离   建立三个vlan vlan10 vlan20 vlan30    www.2cto.com   PC1 PC3属于vlan10 PC2 PC4属于v ...

  7. Date与Calendar

    Date date=new Date();//现在时间 Date date1=new Date(1000);//格林威治时间1997/01/01开始算,后面的是毫秒 Calendar calendar ...

  8. 狗狗40题~ (Volume C)

    A - Triangles 记忆化搜索呗.搜索以某三角形为顶的最大面积,注意边界情况. #include <stdio.h> #include <cstring> #inclu ...

  9. Python学习笔记七-错误和异常

    程序员总是和各种错误打交道,学习如何识别并正确的处理程序错误是很有必要的. 7.1错误和异常 1.错误 从软件方面来看,错误分为语法错误和逻辑错误两种.这两种错误都将导致程序无法正常进行下去,当Pyt ...

  10. 文件操作类CFile

    CFile file; CString str1= L"写入文件成功!"; wchar_t *str2; if (!file.Open(L"Hello.txt" ...