如何使DIV中的内容居中

CSS中设置文字右对齐可以通过代码：

文本段落

1.新建一个html文档，如下图红框所示；

2.可以给文档改个名字，如下图红框所示；

3.然后在和之间输入文字内容，如下图红框所示；

4.进一步设置以下文字的对齐方式，示例代码如下：

孔雀为什么要东南飞？

5.在浏览器中预览，文字就实现了右对齐，如下图红框所示；

1、首先在电脑端找到代码文档，打开要修改的html结构的文档。

2、然后准备写一个div用来放内容，可以给div设置边框。

3、然后在div中添加内容，显示出来会发现内容偏向于左上角，如图所示。

4、接着给div设置水平居中，并且设置行高为div的高度，让其水平垂直居中。

5、还可以改变div的属性，让其display属性为table-cell，在table单元格中可以通过vertical-align垂直居中。

6、若使用display转化后，margin的auto属性不起作用，可以运用栅栏系统进行布局，如图所示。

只需要加上padding元素，内容四周便会留下空白，实现水平垂直居中的效果

css代码如下：

.demo{

width: 200px;

border: 1px solid red;

padding: 20px;

}

HTML代码如下：

效果是这样的：

扩展资料：

关于上述中div设置具体高度

1、内容只有一行

设置div的line-height和div的高度一样即可。

2、内容不确定有几行

这时候需要在div中再加一层结构，用p标签或者div都可以。

css代码如下：

.demo{

position: absolute;

width: 200px;           

height: 200px; 

border: 1px solid red;

}

p{ 

position: absolute;

width: 150px;

top: 50%;

left:50%;

transform: translate(-50%,-50%);

border: 1px solid black;

}

楼上所说的只适用于IE浏览器，要使在不同浏览器都能按要求显示应该这样写：

把div中的内容再套一个div，相当于把小div放在大div里面自适应居中就行了，最好的方法是定位：