css 在页面加入横线

CSS即层叠样式表，是用于在网页中控制样式和布局的语言。它可以通过添加不同的属性和值来改变网页的外观和行为。本文将介绍如何使用CSS在页面上添加横线。

在CSS中，可以使用border-bottom属性来给元素添加底部边框，从而实现添加横线的效果。例如，以下是添加红色横线的代码：

    code>
        .underline {
                border-bottom: 1px solid red;
        }
        /code>
    

上面的代码中，我们使用了一个class名为"underline"的选择器，并为其添加了一个border-bottom属性。其中，1px是边框粗细，solid表示实线，red表示边框颜色。

在HTML中，我们可以将这个class应用到任意元素上，例如一个h1标题：

    code>
            h1 class="underline">
    这是一个标题/h1>
        /code>
    

这样，就可以在这个标题下方添加一条红色的横线了。

除了使用border-bottom属性，我们还可以使用text-decoration属性来给文字添加下划线。例如，以下是添加蓝色下划线的代码：

    code>
        .underline {
                text-decoration: underline blue;
        }
        /code>
    

上面的代码中，我们为"underline"选择器添加了一个text-decoration属性，并设置为下划线和蓝色。可以将这个class应用到任意元素上，同样可以实现添加下划线的效果。

综上，通过CSS的border-bottom属性和text-decoration属性，我们可以轻松地在页面上添加横线和下划线，优化页面的外观效果。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！