html怎么设置下划线长度

htML设置下划线长度的方法：1、给元素添加“display: block; ”样式将其变成块级元素；2、使用border-bottom属性设置下划线样式；3、利用width属性控制下划线长度，语法“width:长度值; ”。

本教程操作环境：windows7系统、CSS3& & HTML5版、Dell G3电脑。

html设置下划线长度的方法

在html中，可以通过border-bottom属性设置下划线样式，然后使用width属性来控制下划线长度。

嵌套是元素必须可以控制宽度，即使用width属性要有效。

也就是说元素必须是块级元素（display: block; ）或行内块级元素（display: inline-block; ）。

实现代码：

!DOCTYPE html>
    html>
    	head>
    		meta charset="utf-8">
    		style>
			a{
    				text-decoration: none;
			}
			.box{
    				display: block;
    				border-bottom:2px solid grey;
    				width:200px;
			}
    		/style>
    	/head>
    	body>
    		a href="#" class="box">
    About/a>
    br>
    		span class="box">
    TechnoLOGy/span>
    	/body>
    /html>
    

推荐教程：《html视频教程》

以上就是html怎么设置下划线长度的详细内容，更多请关注其它相关文章！

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