第一种方式：设置body 居中。在CSS中的代码是（body{text-align:center;}）
第二种方式：用盒子模型，首先设置一个Div ，这个DIV的宽度为100%，然后在这个DIV居中，那么在这个DIV中加的内容就居中显示，代码如下：
<div class="div1">
<div class="div2"></div>
</div>
CSS 样式代码：
<style type="text/css">
.div1{text-align:center;width:100%;}
.div2{width:980px;background:red;} //为了看清效果，加了背景颜色
</style>
第三种方式：margin：0 auto；
通常的方法为：先设置div的宽度，然后使用如下样式：
1margin: 10px auto; /* 上下边距10px，左右边距自动以达到左右居中的目的*/以下为示例：
温馨提示：内容为网友见解，仅供参考
第1个回答 2018-05-18
通过css样式表可以实现，如下图：
效果如下：
知识拓展：
层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
第2个回答 推荐于2017-09-05
你是要水平居中还是垂直居中？
水平居中：
<style>
.juzhong{margin:0px auto; width:500px;}
</style>
<div class=juzhong></div>
垂直居中：
<style>
#mid{
position:absolute;
top:50%;
left:50%;
margin:-150px 0 0 -150px;
width:300px;
height:300px;
border:1px solid red;
}
</style>
<div id=mid></div>
注意，其中margin:-150px 0 0 -150px;
第一个150是高度的一半，第四个150是宽度的一半本回答被提问者采纳
水平居中：
<style>
.juzhong{margin:0px auto; width:500px;}
</style>
<div class=juzhong></div>
垂直居中：
<style>
#mid{
position:absolute;
top:50%;
left:50%;
margin:-150px 0 0 -150px;
width:300px;
height:300px;
border:1px solid red;
}
</style>
<div id=mid></div>
注意，其中margin:-150px 0 0 -150px;
第一个150是高度的一半，第四个150是宽度的一半本回答被提问者采纳
第3个回答 2010-12-10
设置 CSS : margin:0 auto;
但是要记得 DTD 声明 , 否则IE下可能不起作用 :
＜!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”＞
但是要记得 DTD 声明 , 否则IE下可能不起作用 :
＜!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”＞
第4个回答 2010-12-09
margin:auto;就能居中了
相似回答
