
css 多行文本实现距离可调的下划线
在网页设计中,需要对多行文本添加下划线,并可调整其颜色和与文本的距离。对此,可用 css 的 text-decoration 和 text-underline-offset 属性实现。
实现步骤:
- 设置基础样式:使用 text-decoration 属性添加下划线,然后使用 color 属性设置线的颜色。
p {
text-decoration: underline;
color: blue;
}- 调整距离:通过 text-underline-offset 属性可以调整下划线与文本的距离。正值表示下划线在文本下方,负值表示在其上方。
p {
text-underline-offset: 5px;
}完整代码:
立即学习“前端免费学习笔记(深入)”;
多行文本
Kuwebs企业网站管理系统3.1.5 UTF8下载酷纬企业网站管理系统Kuwebs是酷纬信息开发的为企业网站提供解决方案而开发的营销型网站系统。在线留言模块、常见问题模块、友情链接模块。前台采用DIV+CSS,遵循SEO标准。 1.支持中文、英文两种版本,后台可以在不同的环境下编辑中英文。 3.程序和界面分离,提供通用的PHP标准语法字段供前台调用,可以为不同的页面设置不同的风格。 5.支持google地图生成、自定义标题、自定义关键词、自定义描
颜色可调(下划线的颜色可调整)
距离可调(文字和线的位置可调)
p {
text-decoration: underline;
color: blue;
text-underline-offset: 5px;
}在线示例:
[查看演示](https://jsbin.com/kurekinote/...,output)










