第二种方式：用盒子模型，首先设置一个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；
主要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居中的方法。
通过css样式表可以实现，如下图：
效果如下：
知识拓展：
层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
本回答被网友采纳cssdiv居中的三种方法
方法一：使用margin属性实现水平居中 对于单个div元素，可以通过设置左右margin为auto来实现水平居中。这种方法适用于宽度固定的div。例如，给div设置一个固定的宽度，然后将左右margin都设置为auto，浏览器会自动计算并均匀分配两侧空白，使div水平居中。方法二：利用flexbox布局实现灵活居中 Flexbox是CSS3中的...
css样式如何设置div元素水平垂直居中的三种方法
1.建立txt文档，更改后缀名为html,如图：2.右击html文件，选择用记事本打开，如图：3.讲解第一种div绝对定位水平垂直居中【CSS3使用transform】， transform中translate偏移的百分比值是相对于自身大小的，无论绝对定位元素的尺寸是多少，其都是水平垂直居中显示的，但问题是兼容性不好。IE9+以及其他现代浏...
CSS div居中的三种方法
CSS中实现div元素居中的方法有三种，下面分别进行介绍。首先，采用margin方法，通过调整div元素的margin属性，使其四周留出合适的空白，从而达到居中的视觉效果。例如，对id为"nei"的div，设置合适的margin值即可实现。其次，position方法利用绝对定位实现居中。通过设置div的position属性为"absolute"，并计算出...
如何让一个div居中
1、新建一个html文件，命名为test.html，用于讲解CSS怎样让一个div居中。2、在test.html文件中，使用div标签创建一个模块，用于测试居中效果。3、在test.html文件中，设置div的class属性为test，下面将通过该class属性设置其css样式。4、在test.html文件内，编写<styletype=text\/css><\/style>标签，页面...
css中设置div居中显示的方法
1、首先我们用sublime先创建一个html，并且在html里面加入div，如下图所示 2、然后我们在div中加入一些文字，如下图所示，文字用span包裹起来 3、运行页面程序以后我们会看到文字在div的左上角，并没有居中的效果，如下图所示 4、接下来我们就需要用CSS给div中的内容设置居中了，如下图所示，通过text-...
css 让div居中的几种方式
在CSS中，有多种方法可以实现div元素的居中对齐，以下是其中的几种策略：当外部大div和内部小div的宽度和高度都已知且固定时，可以使用margin属性让小div居中。只需为小div设置`margin: auto`即可实现。另一种方法是利用position: absolute;。将小div设为绝对定位，设置left和top为`auto`，可以让小div...
css如何让div页面居中css怎样让div居中
1、首先打开SublimeText软件，新建一个HTML页面，2、然后我们在html页面中加入p标签，并且在p标签中加入一些文字，3、接下来我们给p标签编写CSS样式，这里主要是text-align和line-height两个属性，4、最后我们运行页面程序，你就会在页面中看到p中的文字水平垂直都居中了。htmlcss里面，一个p里的ul怎么让...
css 里面怎么让一个DIV居中 ?
第一种方式：设置body 居中。在CSS中的代码是（body{text-align:center;}）第二种方式：用盒子模型，首先设置一个Div ，这个DIV的宽度为100%，然后在这个DIV居中，那么在这个DIV中加的内容就居中显示，代码如下：<div class="div1"><div class="div2"><\/div><\/div>CSS 样式代码：<style type=...
css 怎么实现 div水平居中 呢
首先，确保你的布局需要将div元素放在一个容器中，这个容器通常为body。为了兼容不同浏览器，给body设置居中样式，如CSS代码所示：body { text-align: center; }接着，对包含div的最外层元素（例如id为"divcss"的div）应用水平居中的关键样式，即margin: 0 auto，这将使div在水平方向上居中。完整的...
如何让div中的div居中?
让div中的div居中可以通过CSS的margin属性或flexbox布局实现。1. 通过CSS的margin属性实现居中 这是一种常见的方法，主要通过设置左右margin为auto来实现。首先，给内层的div设置一个宽度，然后将其左右margin设置为auto，这样浏览器会自动计算左右两侧的空间，使div水平居中。例如：css .inner-div { width...
