记录一个css,实现下划线内容显示,支持文本多行显示

文章目录

概要

css代码

css 复制代码
  display: inline;

  /* 使用 text-decoration 创建下划线 */
  text-decoration: underline;
  text-decoration-color: rgba(255, 122, 0, 0.2);
  text-decoration-thickness: 4px;
  text-underline-offset: -2px; /* 调整下划线位置 */
  /* 让下划线穿过标点符号和括号 */
  -webkit-text-decoration-skip: none;
  text-decoration-skip-ink: none;

  /* 确保每行都有下划线 */
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;

小结

本人自己记录所用。

相关推荐
27669582922 小时前
token1005 算法分析
java·前端·javascript·token·token1005·携程酒店·token算法分析
GISer_Jing2 小时前
前端视频多模态:编解码、传输、渲染全链路详解
前端·人工智能·音视频
恋猫de小郭2 小时前
Flutter PC 多窗口最新进展,底层原生窗口句柄支持已合并
android·前端·flutter
LIO3 小时前
Vue3 + Vite + Pinia + TypeScript 项目完整搭建与实战指南
前端·vue.js
kilito_013 小时前
vue官网例子 讲解2
前端·javascript·vue.js
蜡台3 小时前
Vue实现动态路由
前端·javascript·vue.js·router
xiao阿娜的妙妙屋13 小时前
当AI Agent开始自我进化,我们普通人应该怎么办?
前端
sudo_jin3 小时前
从“谁调用指向谁”到“手写Bind源码”,彻底搞懂JavaScript的this机制
前端·javascript
小蜜蜂dry3 小时前
nestjs实战-登录、鉴权(二)
前端·后端·nestjs