一百度div居中,多数都是一个答案,但是有时候这种方法并不是万能的。。。不废话,将我知道的方法都列举一下好了,随时更新。

1、设置width值,指定margin-left和margin-right为auto(或margin: 0 auto;)(多数人都知道的方法,就不举例子了)

2、设置width,利用margin-left为width的负一半和相对定位实现水平居中(width和margin-left可以设置百分比)

 #demo {
width:500px ;
height:300px;//高度可以不设,用content撑起高度
margin: 0 0 0 -250px;//(或者直接设置margin-left: -250px;)
position:relative;相对定位
background-color:pink;//方便看效果
left:50%;
top:50%;
}
<div id="demo"></div>

3、待续。。。

如何让div水平居中呢?的更多相关文章

  1. 通过设置CSS属性让DIV水平居中

    通过设置CSS属性让DIV水平居中 ---------------------- <html> <head> <title></title> <m ...

  2. div水平居中

    1.先给它外层的div定位并left:position:absolute;left:50%; 2.获取当前元素div的宽度,并除以2 3.改变它的css:margin-left:-(获取当前元素div ...

  3. div水平居中与垂直居中的方法【摘自美浩工作室官方博客 】

    大家往往在写页面中会遇到不固定宽和高的div如果水平和垂直都居中呢?在写css的时候经常遇到的一个问题,当div没有固定的宽度或者高度的时候,如何才能让div水平或者垂直居中显示.如果div有固定宽度 ...

  4. 【转】div居中代码 DIV水平居中显示CSS代码

    原文地址:http://www.divcss5.com/rumen/r622.shtml 如何使用CSS让DIV居中显示,让div水平居中有哪些CSS样式呢? 需要的主要css代码有两个,一个为tex ...

  5. 第三章Div水平居中

    1.div居中 text-align:center可以让元素里面的文字内容居中,但并不能让div居中.要让div水平居中必须设置div宽度,外边距设置为margin:0 auto <%@ Pag ...

  6. css+div水平居中

    实现div内容水平居中 实现方案一:margin:0 auto; div{ height:100px; width:100px; background:red; margin:0 auto; } &l ...

  7. 大div中,三个小div水平居中

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. div水平居中和垂直居中

    水平居中和垂直居中 水平居中包含两种情况:        块级元素的水平居中:margin:0px auto;        文字内容的水平居中:text-align: center;        ...

  9. [转]CSS网页布局:div水平居中的各种方法

    http://jingyan.baidu.com/article/fa4125ac90a2a328ac70929e.html 在Web标准中的页面布局是使用Div配合CSS来实现的.这其中最常用到的就 ...

  10. div 水平居中

    对需要水平居中的DIV层添加以下属性: margin-left: auto; margin-right: auto;

随机推荐

  1. 直接请求转发(Forward)和间接请求转发(Redirect)两种区别?

    用户向服务器发送了一次HTTP请求,该请求肯能会经过多个信息资源处理以后才返回给用户,各个信息资源使用请求转发机制相互转发请求,但是用户是感觉不到请求转发的.根据转发方式的不同,可以区分为直接请求转发 ...

  2. Java数据持久层框架 MyBatis之API学习七(动态 SQL详解)

    对于MyBatis的学习而言,最好去MyBatis的官方文档:http://www.mybatis.org/mybatis-3/zh/index.html 对于语言的学习而言,马上上手去编程,多多练习 ...

  3. [知了堂学习笔记]_MVC设计模式与JavaWEB三层架构

    一.MVC设计模式 MVC模式(Model-View-Controller)是软件工程中的一种软件架构模式,把软件系统分为三个基本部分:模型(Model).视图(View)和控制器(Controlle ...

  4. Effective Java 第三版——28. 列表优于数组

    Tips <Effective Java, Third Edition>一书英文版已经出版,这本书的第二版想必很多人都读过,号称Java四大名著之一,不过第二版2009年出版,到现在已经将 ...

  5. 互联网公司为啥不使用mysql分区表?

    转:http://www.cnblogs.com/zhulin516114/p/7306708.html 缘起:有个朋友问我分区表在58的应用,我回答不出来,在我印象中,百度.58都没有听说有分区表相 ...

  6. Linux指令--rcp,scp

    rcp代表"remote file copy"(远程文件拷贝).该命令用于在计算机之间拷贝文件.rcp命令有两种格式.第一种格式用于文件到文件的拷贝:第二种格式用于把文件或目录拷贝 ...

  7. Linux指令--head,tail

    原文出处:http://www.cnblogs.com/peida/archive/2012/11/06/2756278.html head 与 tail 就像它的名字一样的浅显易懂,它是用来显示开头 ...

  8. Linux指令--cd,pwd

    本文参照博客做了修改和总结,感谢作者的分享.http://www.cnblogs.com/peida/archive/2012/10/24/2736501.html cd 命令可以说是Linux中最基 ...

  9. Java常用类--处理日期

    Date Date类在java.util包中.使用Date类的无参数构造方法创建的对象可以获取本地当前时间.一般来说,也只使用这个.因为date的很多方法都已经不推荐使用了,所以Date的功能大大的消 ...

  10. ProgressDialog的使用及逻辑处理

    一般用的情况先声明一个ProgressDialog progressShow = true;(用来判断用户是否点击了取消键) final ProgressDialog pd = new Progres ...