如何使用CSS在水平线中间添加文字?

如何使用CSS将文字显示在水平线中间?下面本篇文章就来给大家介绍使用CSS实现文字显示在水平线中间效果的方法,希望对大家有所帮助。

如何使用CSS在水平线中间添加文字?_第1张图片

CSS提供了在网页中间制作包含文字或图像的水平线以使其具有吸引力的功能,这可以通过使用简单的CSS属性来实现。

语法:

h4:before, h4:after {

    content: "";

    flex: 1 1;

    border-bottom: 2px solid #000;

    margin: auto;

}

示例1:将文字显示在水平线中间

HTML中文网

效果图:

如何使用CSS在水平线中间添加文字?_第2张图片

示例2:将图像显示在水平线中间

       

效果图:

如何使用CSS在水平线中间添加文字?_第3张图片



本文参考地址:https://www.html.cn/qa/css3/10295.html

你可能感兴趣的:(如何使用CSS在水平线中间添加文字?)