本文摘自PHP中文网,作者藏色散人,侵删。
css中设置字体下划线的方法:1、使用“text-decoration:underline;”设置下划线样式;2、通过“border-bottom”属性设置下划线样式。
本教程操作环境:windows7系统、HTML5&&CSS3版、Dell G3电脑。
在CSS中可以使用text-decoration属性或border-bottom属性来给字体设置下划线样式。
1、使用text-decoration:underline;设置下划线样式
CSS的text-decoration属性用于指定添加到文本的修饰,其underline属性值可以定义文本下的一条线。
语法:
1 |
|
代码示例:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
|
css text-decoration属性添加的下划线是最简单样式,而且没有办法设置什么比较特别的样式,比如把下划线设置成虚点状的。下面我们看看另一种添加下划线的方法,可以设置不同的下划线样式。
【推荐:《css视频教程》】
2、使用border-bottom属性设置下划线样式
CSS的border-bottom属性可以设置元素下边框样式,这样就可以在文字下添加一条线。
语法:
1 |
|
参数:
width:规定下边框的宽度。
style:规定下边框的样式。
color:规定下边框的颜色。
说明:border-bottom属性可以通过控制线的粗细、颜色、样式来实现不同的文字下划线样式。
相关阅读 >>
更多相关阅读请进入《css》频道 >>

Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者