CSS中怎么让DIV水平居中

时间：2014-11-18 23:10:34 阅读：204 评论：0 收藏：0 [点我收藏+]

今天用CSS碰到个很棘手的问题,DIV本身没有定义自己居中的属性,

网上很多的方法都是介绍用上级的text-align: center然后嵌套一层DIV来解决问题.

text-align:center;这个属性不是让div居中的，是让div中的内容居中,

当我们想让一个容器中的div水平居中其实方法很简单只需定义margin就行了，即margin:0 auto;然后你的div就水平居中了。

如下代码例子：

　　box2在box1中水平居中：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <title>div居中问题</title>
  <style type="text/css">
   .box1{
    width:1000px;
    height: 700px;
    background-color:blue;
   }
   .box2{
    width:666px;
    height: 500px;
    background-color: #ccc;
    margin: 0 auto;
   }
  </style>
</head>
<body>
  <div class="box1">
   <div class="box2"></div>
  </div>
</body>
</html>

CSS中怎么让DIV水平居中

标签：style color ar sp for div on 问题代码

原文地址：http://www.cnblogs.com/ElseYZ/p/4106182.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行