主要css代码有两个：
1,text-align:center
2,margin:0 auto；
其两个样式需要配合使用才能实现div盒子的居中显示排版。
首先我们对body设置text-align:center，再对需要居中的div盒子设置css样式margin:0 auto，这样即可让对应div水平居中。
举个例子，居中代码为：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS使div居中制作</title>
<style>
body{ text-align:center}
#nav{ margin:0 auto; width:200px; height:150px; border:5px double #FF0066;}
/* css注释：为了观察效果设置宽度 高度 边框等样式 */
</style>
</head>
<body>
<div id="nav">
DIV居中
</div>
</body>
</html>
为了观察div居中效果，我们对div设置一个div命名为“#div”在html中div标签内使用id=“nav”,设置其宽度为200px;高度为150px，边框也设置了颜色。
效果如图：
以上就是CSS让DIV居中的方法。
温馨提示：内容为网友见解，仅供参考
无其他回答
相似回答
