[分享]css中h3水平居中

在进行网页设计时，我们时常需要对一些标题进行样式调整，其中涉及到的一个常见需求就是水平居中。这往往是我们为了美观而进行的一种设计。那么，如何让水平居中呢？下面我将介绍两种方法：方法一： textali...

在进行网页设计时，我们时常需要对一些标题进行样式调整，其中涉及到的一个常见需求就是

水平居中

那么，如何让

水平居中

方法一：
text-align: center; 

我们可以使用text-align: center;来让

水平居中

标签上，也可以应用在父元素上， 从而使其父元素内的所有

标签水平居中。同时，我们可以设置只让某个区域内的

标签水平居中，而不影响其他区域。

例如：

.center {
   text-align: center;
}
.center h3 {
   display: inline-block;
} 

上述代码将让.center类内的

标签水平居中。同时，display: inline-block;会消除元素的块级化特性，使其行内排列，从而达到水平居中的效果。

方法二：
margin: 0 auto; 

其实，我们还可以使用margin: 0 auto;来让

水平居中

例如：

.center {
   width: 500px;
   margin: 0 auto;
}
.center h3 {
   display: inline-block;
} 

上述代码将让.center类内的

标签水平居中。同时，为了让其能够水平居中，我们在.center类中设置了宽度，因为只有块级元素才能设置宽度，行内元素不能设置宽度。

总之，以上两种方法都可以让

水平居中