怎么把元素居中在网页（怎么让网页里的内容居中）

网页设计教程:如何将页面居中

实现页面居中对齐的方法有很多。让我们来看看如何使页面居中。

01

新建html页面

首先打开visual studio软件，然后新建一个HTML页面，如下图所示:

02

主要的

然后创建一个名为main的div，随便写几个字，如下图所示:

03

居中对齐

然后用代码body { margin:0 auto；来样式化body主题；宽度:780px}如下图所示:

04

预览效果

浏览器中的预览效果如下图所示:

DIV怎么使中间的东西居中？

1、在 DIV 标签对中写入的正文标签的 HTML 中<p></p>。

2、然后我们将 p 设置为宽高度, 我们需要注意的是, 如果您不设置默认值的宽度为100% 哦, 所以它将填充整个页面。

3、然后我们设置 Div 的边距, 第一个参数指示顶部的距离为 0, 第二个自动表示自动。也就是说, 在设置此设置后, p 将根据页面自动居中。

4、浏览效果好后, 您可以看到此时 DIV 块已自动居中, 它与浏览器的左右两侧距离相同。

p怎样居中？HTML中p怎样居中呢？

CSS来实现DIV居中，用CSS实现DIV居中的方法有很多，这次教给大家的是比较简单并且兼容性很棒的一段代码，快点进来看看吧。

需要的主要css代码有两个，一个为text-align:center（内容居中），另外一个为margin:0 auto；其两个样式需要配合使用才能实现p盒子的居中显示排版。

首先我们对body设置text-align:center，再对需要居中的p盒子设置css样式margin:0 auto，这样即可让对应p水平居中。

p居中代码应用，为了观察p居中效果，我们对p设置一个p命名为“.p”在html中p标签内使用class=“p”,设置其宽度为400px;高度为100px，边框为红色。以便我们观察效果。

1、完整html+css代码

<!DOCTYPE html> <html> <head> <meta charset=”utf-8″ /> <title>p居中</title> <style> body{ text-align:center} .p{ margin:0 auto; width:400px; height:100px; border:1px solid #F00} /* css注释：为了观察效果设置宽度边框高度等样式 */ </style> </head> <body> <p > p居中 </p> </body> </html>

效果图：

此居中方法是让p居中效果完美兼容各大平台、兼容各大浏览器，无论高版本ie还是高版本的ie均兼容。

CSS中怎么让文字始终在页面的中间？

1.新建一个html文件，命名为test.html，用于讲解利用CSS怎么让文字居中。

2.在test.html文件内，使用p标签创建一个模块，并设置其class属性为bob，下面将通过该class设置其css样式。

3.在test.html文件内，在p标签内，使用p标签创建一行文字，下面将利用CSS让文字居中。

4+在test.html文件内，编写<style type="text/css"></style>标签，页面的css样式将写在该标签内。

5.在css标签内，对类名为bob的p进行样式设置，定义其宽度为300px，高度为30px，背景颜色为红色。

6.在css标签内，对p元素进行样式设置，使用text-align属性设置文字居中（center），文字颜色为白色。

7.在浏览器打开test.html文件，查看实现的效果。

html怎么让p里的文本居中？

1、首先打开Sublime Text软件，新建一个HTML页面，

2、然后我们在html页面中加入p标签，并且在p标签中加入一些文字，

3、接下来我们给p标签编写CSS样式，这里主要是text-align和line-height两个属性，

4、最后我们运行页面程序，你就会在页面中看到p中的文字水平垂直都居中了。