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视频教程》