HTML 中的居中标签：<center>

在 HTML 中通过使用 <center> 标签可以将元素内容居中展示。<center> 标签已在 HTML5 中废弃，建议使用 CSS 中的布局属性来实现居中效果。

语法

<center>内容</center>

示例

<center>
  <h1>这是一个标题</h1>
  <p>这是一段文本内容</p>
  <img src="image.jpg" alt="图片描述">
</center>

效果：

这是一个标题

这是一段文本内容

CSS 替代方案

使用 CSS 中的 text-align 和 margin 属性，可以实现文本或元素的居中效果。

水平居中

1. 对于块级元素，使用 margin: auto; 实现自动居中。

.parent {
  width: 800px;
}
.child {
  width: 400px;
  margin: auto;
}

2. 对于行内元素，使用 text-align: center; 实现居中。

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

垂直居中

1. 对于单行文本元素，使用 line-height 属性实现。

.parent {
  height: 80px;
  line-height: 80px;
}

2. 对于多行文本或元素，使用 Flexbox 实现。

.parent {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
}

以上就是关于 HTML 中的 <center> 标签以及 CSS 中的替代方案的介绍。建议使用 CSS 实现居中效果，从过时的标签中解放出来。