来源于小红书博主42miles，把她的做了一些扩展，还有ai和结合很久以前不知道在哪里看到的高亮css参考
随便截的实验图，支持虚线，点，波浪线，实线，还有7种色彩，
使用方法:高亮前面＋标签
标签格式：[颜色]-[线型]
颜色：red, orange, yellow, green, purple, sea-green, cyan, frost, blue, salmon
线型：solid, dashed, dotted, wavy
示例：#red-solid, #green-dashed, #blue-wavy
这里有一个问题，就是阅读模式下，一个段落内用到多个样式会这样
/* ========================================
彩色下划线标签样式
用法：<a href="#标签名"></a><mark>文本</mark>
标签格式：[颜色]-[线型]
颜色：red, orange, yellow, green, purple, sea-green, cyan, frost, blue, salmon
线型：solid, dashed, dotted, wavy
示例：#red-solid, #green-dashed, #blue-wavy
======================================== */
/* ---------- 颜色变量 ---------- */
.theme-light,
.theme-dark {
--color-red-rgb: 191, 97, 106;
--color-orange-rgb: 208, 135, 112;
--color-yellow-light-rgb: 235, 203, 139;
--color-yellow-dark-rgb: 228, 184, 96;
--color-green-rgb: 163, 190, 140;
--color-purple-rgb: 180, 142, 173;
--color-sea-green-rgb: 143, 188, 187;
--color-cyan-rgb: 136, 192, 208;
--color-frost-rgb: 129, 161, 193;
--color-blue-rgb: 94, 129, 172;
--color-salmon-rgb: 252, 110, 104;
--color-red: rgb(var(--color-red-rgb));
--color-orange: rgb(var(--color-orange-rgb));
--color-yellow: rgb(var(--color-yellow-light-rgb));
--color-green: rgb(var(--color-green-rgb));
--color-purple: rgb(var(--color-purple-rgb));
--color-sea-green: rgb(var(--color-sea-green-rgb));
--color-cyan: rgb(var(--color-cyan-rgb));
--color-frost: rgb(var(--color-frost-rgb));
--color-blue: rgb(var(--color-blue-rgb));
--color-salmon: rgb(var(--color-salmon-rgb));
}
/* ---------- 隐藏所有标签链接 ---------- */
.theme-light a[href^="#red-"],
.theme-dark a[href^="#red-"],
.theme-light a[href^="#orange-"],
.theme-dark a[href^="#orange-"],
.theme-light a[href^="#yellow-"],
.theme-dark a[href^="#yellow-"],
.theme-light a[href^="#green-"],
.theme-dark a[href^="#green-"],
.theme-light a[href^="#purple-"],
.theme-dark a[href^="#purple-"],
.theme-light a[href^="#sea-green-"],
.theme-dark a[href^="#sea-green-"],
.theme-light a[href^="#cyan-"],
.theme-dark a[href^="#cyan-"],
.theme-light a[href^="#frost-"],
.theme-dark a[href^="#frost-"],
.theme-light a[href^="#blue-"],
.theme-dark a[href^="#blue-"],
.theme-light a[href^="#salmon-"],
.theme-dark a[href^="#salmon-"] {
display: none !important;
}
/* ========== 阅读模式样式 ========== */
/* ----- 红色下划线（4种线型）----- */
.theme-light a[href^="#red-solid"] + mark,
.theme-dark a[href^="#red-solid"] + mark {
background-color: rgba(var(--color-red-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: solid !important;
text-decoration-color: var(--color-red) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#red-dashed"] + mark,
.theme-dark a[href^="#red-dashed"] + mark {
background-color: rgba(var(--color-red-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dashed !important;
text-decoration-color: var(--color-red) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#red-dotted"] + mark,
.theme-dark a[href^="#red-dotted"] + mark {
background-color: rgba(var(--color-red-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dotted !important;
text-decoration-color: var(--color-red) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#red-wavy"] + mark,
.theme-dark a[href^="#red-wavy"] + mark {
background-color: rgba(var(--color-red-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: wavy !important;
text-decoration-color: var(--color-red) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
/* ----- 橙色下划线（4种线型）----- */
.theme-light a[href^="#orange-solid"] + mark,
.theme-dark a[href^="#orange-solid"] + mark {
background-color: rgba(var(--color-orange-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: solid !important;
text-decoration-color: var(--color-orange) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#orange-dashed"] + mark,
.theme-dark a[href^="#orange-dashed"] + mark {
background-color: rgba(var(--color-orange-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dashed !important;
text-decoration-color: var(--color-orange) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#orange-dotted"] + mark,
.theme-dark a[href^="#orange-dotted"] + mark {
background-color: rgba(var(--color-orange-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dotted !important;
text-decoration-color: var(--color-orange) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#orange-wavy"] + mark,
.theme-dark a[href^="#orange-wavy"] + mark {
background-color: rgba(var(--color-orange-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: wavy !important;
text-decoration-color: var(--color-orange) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
/* ----- 黄色下划线（4种线型）----- */
.theme-light a[href^="#yellow-solid"] + mark,
.theme-dark a[href^="#yellow-solid"] + mark {
background-color: rgba(var(--color-yellow-light-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: solid !important;
text-decoration-color: var(--color-yellow) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#yellow-dashed"] + mark,
.theme-dark a[href^="#yellow-dashed"] + mark {
background-color: rgba(var(--color-yellow-light-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dashed !important;
text-decoration-color: var(--color-yellow) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#yellow-dotted"] + mark,
.theme-dark a[href^="#yellow-dotted"] + mark {
background-color: rgba(var(--color-yellow-light-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dotted !important;
text-decoration-color: var(--color-yellow) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#yellow-wavy"] + mark,
.theme-dark a[href^="#yellow-wavy"] + mark {
background-color: rgba(var(--color-yellow-light-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: wavy !important;
text-decoration-color: var(--color-yellow) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
/* ----- 绿色下划线（4种线型）----- */
.theme-light a[href^="#green-solid"] + mark,
.theme-dark a[href^="#green-solid"] + mark {
background-color: rgba(var(--color-green-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: solid !important;
text-decoration-color: var(--color-green) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#green-dashed"] + mark,
.theme-dark a[href^="#green-dashed"] + mark {
background-color: rgba(var(--color-green-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dashed !important;
text-decoration-color: var(--color-green) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#green-dotted"] + mark,
.theme-dark a[href^="#green-dotted"] + mark {
background-color: rgba(var(--color-green-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dotted !important;
text-decoration-color: var(--color-green) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#green-wavy"] + mark,
.theme-dark a[href^="#green-wavy"] + mark {
background-color: rgba(var(--color-green-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: wavy !important;
text-decoration-color: var(--color-green) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
/* ----- 紫色下划线（4种线型）----- */
.theme-light a[href^="#purple-solid"] + mark,
.theme-dark a[href^="#purple-solid"] + mark {
background-color: rgba(var(--color-purple-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: solid !important;
text-decoration-color: var(--color-purple) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#purple-dashed"] + mark,
.theme-dark a[href^="#purple-dashed"] + mark {
background-color: rgba(var(--color-purple-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dashed !important;
text-decoration-color: var(--color-purple) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#purple-dotted"] + mark,
.theme-dark a[href^="#purple-dotted"] + mark {
background-color: rgba(var(--color-purple-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dotted !important;
text-decoration-color: var(--color-purple) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#purple-wavy"] + mark,
.theme-dark a[href^="#purple-wavy"] + mark {
background-color: rgba(var(--color-purple-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: wavy !important;
text-decoration-color: var(--color-purple) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
/* ----- 海绿色下划线（4种线型）----- */
.theme-light a[href^="#sea-green-solid"] + mark,
.theme-dark a[href^="#sea-green-solid"] + mark {
background-color: rgba(var(--color-sea-green-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: solid !important;
text-decoration-color: var(--color-sea-green) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#sea-green-dashed"] + mark,
.theme-dark a[href^="#sea-green-dashed"] + mark {
background-color: rgba(var(--color-sea-green-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dashed !important;
text-decoration-color: var(--color-sea-green) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#sea-green-dotted"] + mark,
.theme-dark a[href^="#sea-green-dotted"] + mark {
background-color: rgba(var(--color-sea-green-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dotted !important;
text-decoration-color: var(--color-sea-green) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#sea-green-wavy"] + mark,
.theme-dark a[href^="#sea-green-wavy"] + mark {
background-color: rgba(var(--color-sea-green-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: wavy !important;
text-decoration-color: var(--color-sea-green) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
/* ----- 青色下划线（4种线型）----- */
.theme-light a[href^="#cyan-solid"] + mark,
.theme-dark a[href^="#cyan-solid"] + mark {
background-color: rgba(var(--color-cyan-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: solid !important;
text-decoration-color: var(--color-cyan) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#cyan-dashed"] + mark,
.theme-dark a[href^="#cyan-dashed"] + mark {
background-color: rgba(var(--color-cyan-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dashed !important;
text-decoration-color: var(--color-cyan) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#cyan-dotted"] + mark,
.theme-dark a[href^="#cyan-dotted"] + mark {
background-color: rgba(var(--color-cyan-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dotted !important;
text-decoration-color: var(--color-cyan) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#cyan-wavy"] + mark,
.theme-dark a[href^="#cyan-wavy"] + mark {
background-color: rgba(var(--color-cyan-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: wavy !important;
text-decoration-color: var(--color-cyan) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
/* ----- 霜色下划线（4种线型）----- */
.theme-light a[href^="#frost-solid"] + mark,
.theme-dark a[href^="#frost-solid"] + mark {
background-color: rgba(var(--color-frost-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: solid !important;
text-decoration-color: var(--color-frost) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#frost-dashed"] + mark,
.theme-dark a[href^="#frost-dashed"] + mark {
background-color: rgba(var(--color-frost-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dashed !important;
text-decoration-color: var(--color-frost) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#frost-dotted"] + mark,
.theme-dark a[href^="#frost-dotted"] + mark {
background-color: rgba(var(--color-frost-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dotted !important;
text-decoration-color: var(--color-frost) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#frost-wavy"] + mark,
.theme-dark a[href^="#frost-wavy"] + mark {
background-color: rgba(var(--color-frost-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: wavy !important;
text-decoration-color: var(--color-frost) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
/* ----- 蓝色下划线（4种线型）----- */
.theme-light a[href^="#blue-solid"] + mark,
.theme-dark a[href^="#blue-solid"] + mark {
background-color: rgba(var(--color-blue-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: solid !important;
text-decoration-color: var(--color-blue) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#blue-dashed"] + mark,
.theme-dark a[href^="#blue-dashed"] + mark {
background-color: rgba(var(--color-blue-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dashed !important;
text-decoration-color: var(--color-blue) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#blue-dotted"] + mark,
.theme-dark a[href^="#blue-dotted"] + mark {
background-color: rgba(var(--color-blue-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dotted !important;
text-decoration-color: var(--color-blue) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#blue-wavy"] + mark,
.theme-dark a[href^="#blue-wavy"] + mark {
background-color: rgba(var(--color-blue-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: wavy !important;
text-decoration-color: var(--color-blue) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
/* ----- 鲑鱼色下划线（4种线型）----- */
.theme-light a[href^="#salmon-solid"] + mark,
.theme-dark a[href^="#salmon-solid"] + mark {
background-color: rgba(var(--color-salmon-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: solid !important;
text-decoration-color: var(--color-salmon) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#salmon-dashed"] + mark,
.theme-dark a[href^="#salmon-dashed"] + mark {
background-color: rgba(var(--color-salmon-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dashed !important;
text-decoration-color: var(--color-salmon) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#salmon-dotted"] + mark,
.theme-dark a[href^="#salmon-dotted"] + mark {
background-color: rgba(var(--color-salmon-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: dotted !important;
text-decoration-color: var(--color-salmon) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light a[href^="#salmon-wavy"] + mark,
.theme-dark a[href^="#salmon-wavy"] + mark {
background-color: rgba(var(--color-salmon-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
text-decoration-style: wavy !important;
text-decoration-color: var(--color-salmon) !important;
text-underline-offset: 4px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
/* ========== 实时预览模式（编辑）样式 ========== */
/* 隐藏所有标签标记（通配所有颜色-线型组合） */
.cm-tag[class*="cm-tag-red-"],
.cm-tag[class*="cm-tag-orange-"],
.cm-tag[class*="cm-tag-yellow-"],
.cm-tag[class*="cm-tag-green-"],
.cm-tag[class*="cm-tag-purple-"],
.cm-tag[class*="cm-tag-sea-green-"],
.cm-tag[class*="cm-tag-cyan-"],
.cm-tag[class*="cm-tag-frost-"],
.cm-tag[class*="cm-tag-blue-"],
.cm-tag[class*="cm-tag-salmon-"] {
display: none !important;
}
/* 实时预览样式 - 使用通用选择器匹配所有颜色-线型组合 */
.theme-light [class*="cm-tag-red-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-red-"] ~ span.cm-highlight {
background-color: rgba(var(--color-red-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light [class*="cm-tag-orange-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-orange-"] ~ span.cm-highlight {
background-color: rgba(var(--color-orange-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light [class*="cm-tag-yellow-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-yellow-"] ~ span.cm-highlight {
background-color: rgba(var(--color-yellow-light-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light [class*="cm-tag-green-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-green-"] ~ span.cm-highlight {
background-color: rgba(var(--color-green-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light [class*="cm-tag-purple-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-purple-"] ~ span.cm-highlight {
background-color: rgba(var(--color-purple-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light [class*="cm-tag-sea-green-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-sea-green-"] ~ span.cm-highlight {
background-color: rgba(var(--color-sea-green-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light [class*="cm-tag-cyan-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-cyan-"] ~ span.cm-highlight {
background-color: rgba(var(--color-cyan-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light [class*="cm-tag-frost-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-frost-"] ~ span.cm-highlight {
background-color: rgba(var(--color-frost-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light [class*="cm-tag-blue-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-blue-"] ~ span.cm-highlight {
background-color: rgba(var(--color-blue-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
.theme-light [class*="cm-tag-salmon-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-salmon-"] ~ span.cm-highlight {
background-color: rgba(var(--color-salmon-rgb), 0.14) !important;
padding: 3px 1px !important;
text-decoration-line: underline !important;
text-decoration-thickness: 1px !important;
border-radius: 1px !important;
color: inherit !important;
font-weight: normal !important;
}
/* 单独设置各线型的下划线样式（实时预览） */
.theme-light [class*="-solid"] ~ span.cm-highlight,
.theme-dark [class*="-solid"] ~ span.cm-highlight {
text-decoration-style: solid !important;
}
.theme-light [class*="-dashed"] ~ span.cm-highlight,
.theme-dark [class*="-dashed"] ~ span.cm-highlight {
text-decoration-style: dashed !important;
}
.theme-light [class*="-dotted"] ~ span.cm-highlight,
.theme-dark [class*="-dotted"] ~ span.cm-highlight {
text-decoration-style: dotted !important;
}
.theme-light [class*="-wavy"] ~ span.cm-highlight,
.theme-dark [class*="-wavy"] ~ span.cm-highlight {
text-decoration-style: wavy !important;
}
/* 设置下划线颜色（实时预览） */
.theme-light [class*="cm-tag-red-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-red-"] ~ span.cm-highlight {
text-decoration-color: var(--color-red) !important;
}
.theme-light [class*="cm-tag-orange-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-orange-"] ~ span.cm-highlight {
text-decoration-color: var(--color-orange) !important;
}
.theme-light [class*="cm-tag-yellow-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-yellow-"] ~ span.cm-highlight {
text-decoration-color: var(--color-yellow) !important;
}
.theme-light [class*="cm-tag-green-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-green-"] ~ span.cm-highlight {
text-decoration-color: var(--color-green) !important;
}
.theme-light [class*="cm-tag-purple-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-purple-"] ~ span.cm-highlight {
text-decoration-color: var(--color-purple) !important;
}
.theme-light [class*="cm-tag-sea-green-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-sea-green-"] ~ span.cm-highlight {
text-decoration-color: var(--color-sea-green) !important;
}
.theme-light [class*="cm-tag-cyan-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-cyan-"] ~ span.cm-highlight {
text-decoration-color: var(--color-cyan) !important;
}
.theme-light [class*="cm-tag-frost-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-frost-"] ~ span.cm-highlight {
text-decoration-color: var(--color-frost) !important;
}
.theme-light [class*="cm-tag-blue-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-blue-"] ~ span.cm-highlight {
text-decoration-color: var(--color-blue) !important;
}
.theme-light [class*="cm-tag-salmon-"] ~ span.cm-highlight,
.theme-dark [class*="cm-tag-salmon-"] ~ span.cm-highlight {
text-decoration-color: var(--color-salmon) !important;
}