以下是一些适合您提供的文本的基于问题的文章标题： * 如何创建居中标题，两侧有水平线（无背景）？ * 想要给你添加水平线

如何创建两侧有水平线且没有背景的标题

在这种情况下，您需要使用以下命令创建居中的页面标题两边有水平线，没有任何背景颜色。

CSS 解决方案：

h1 {
    position: relative;
    font-size: 30px;
    z-index: 1;
    overflow: hidden;
    text-align: center;
}
h1:before, h1:after {
    position: absolute;
    top: 51%;
    overflow: hidden;
    width: 50%;
    height: 1px;
    content: '\a0';
    background-color: red;
}
h1:before {
    margin-left: -50%;
    text-align: right;
}

/*Optional for background color*/
.color {
    background-color: #ccc;
}

说明：

• h1 使用 text-align: center 相对定位和居中。
• 使用 :before 和 :after 创建元素之前和之后，并绝对定位在 51% 顶部以垂直居中它们。
• 带有“a0”（不间断空格）的内容属性使线条在文本所在的位置消失。
• 溢出：隐藏确保线条不会与文本重叠。
• 您可以选择如果需要，可以使用 .color 类添加背景颜色。

注意：此解决方案可以处理不同长度的标题，而无需手动调整行位置。

以上是以下是一些适合您提供的文本的基于问题的文章标题： * 如何创建居中标题，两侧有水平线（无背景）？ * 想要给你添加水平线的详细内容。更多信息请关注PHP中文网其他相关文章！