【CSS Snippet】预览时隐藏高亮

• 文档添加 cssclasses: preview-hide-mark-underline 属性，则此文档内高亮内容在预览时会显示为：这里是一些用来演示的文字，而在编辑模式下正常显示为高亮。
• 文档添加 cssclasses: preview-hide-mark-brackets 属性，则此文档内高亮内容在预览时会显示为：（这里是一些用来演示的文字），而在编辑模式下正常显示为高亮。

应该可以用来用来辅助背题啥的。

样式代码

将如下代码保存到 .obsidian/snippets/HideHighlightWhenPreview.css 文件中（自行创建文件），然后在 Obsidian 设置——外观——代码片段中开启。记得在需要的笔记中添加上述对应属性。

/**
 * @name: Hide Highlight When Preview
 * @id: obsidian-hide-highlight-when-preview
 * @author: 稻米鼠
 * @description: Hide highlighted content during preview to help with memorization and self-testing.
 * @created: 2024-08-09 15:06:53
 * @updated: 2024-08-09 15:06:53
 * @version: 0.0.1
 */

.markdown-rendered.preview-hide-mark-underline mark {
  color: transparent;
  background-color: transparent;
  text-decoration: underline solid var(--text-normal);
}
.markdown-rendered.preview-hide-mark-brackets mark {
  color: transparent;
  background-color: transparent;
  &::before,
  &::after {
    color: var(--text-normal);
  }
  &::before {
    content: "（";
  }
  &::after {
    content: "）";
  }
}

注意

• 两种样式不能同时使用
• 不能同时使用其他高亮样式