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)
以上就是CSS如何设置多行文本的可调下划线距离？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1630181.html
微信扫一扫 
支付宝扫一扫 
