一百度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. mysql 性能优化常见命令

    mysql 性能优化常见命令: 一: 当发现mysql程序运行缓慢时,在排除sql主机问题之后,可以尝试在schema,table,和sql上进一步进行考查: 1:mysql> show ful ...

  2. Python random模块(获取随机数)

    1.random.random 随机生成一个0到1的随机浮点数: 0 <= n < 1.0 In [2]: print random.random() 0.544824016934 2.r ...

  3. 安装新的int 9中断例程

    body, table{font-family: 微软雅黑; font-size: 13.5pt} table{border-collapse: collapse; border: solid gra ...

  4. Redis 2种持久化模式的缺陷

    http://blog.csdn.net/hexieshangwang/article/details/47254087 一.RDB持久化模式缺陷 1.问题描述: 并发200路,模拟不断写Redis, ...

  5. python_如何在一个for循环中迭代多个可迭代对象?

    案例: 某班学生期末考试成绩,语文.数学.英语分别存储在3个列表中,同时迭代三个列表.,计算每个学生的总分(并行) 某年级有4个班,某次英语成绩分别记录在4个列表中,依次迭代每个列表,统计全年级高于9 ...

  6. MySql全文索引

    使用索引是数据库性能优化的必备技能之一.在MySQL数据库中,有四种索引:聚集索引(主键索引).普通索引.唯一索引以及我们这里将要介绍的全文索引(FULLTEXT INDEX). 全文索引(也称全文检 ...

  7. 【转】GPS网平差

    进行GPS网平差的目的主要有三个: (1)消除由观测量和已知条件中存在的误差所引起的GPS网在几何上的不一致.包括闭合环闭合差不为0:复测基线较差不为0:通过由基线向量所形成的导线,将坐标由一个已知点 ...

  8. 赋值号和printf

    1.赋值号会自动转换类型: int a= 2.1; printf(‘‘%d’’,a);         //输出结果是2 2.printf不会转换类型,而是直接将内存中表示的补码数拿出来,最明显的就是 ...

  9. 《NET 设计规范》第 2 章 框架设计基础

    <NET 设计规范>第 2 章 框架设计基础 要设计功能强大又易于使用的框架. 要理解广大开发人员并有针对性地为他们设计框架. 要理解各种编程语言,并为他们设计框架. 2.1 渐进框架 2 ...

  10. 深入浅出Hadoop之HDFS

    hadoop生态系统一直是大数据灵域的热点,其中包括今天要聊的HDFS,和计划以后想聊的yarn, mapreduce, spark, hive, hbase, 已经聊过的zookeeper,等等. ...