quartz/content/blog-20250204.md
2025-02-05 02:17:17 +08:00

89 lines
2.8 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

---
title: Obsidian 中文斜体楷体优化插件
publish: true
tags:
- obsidian
date: 2025-02-04
comments: true
---
>[!abstract] 简介
>让 Obsidian 的中文斜体优雅显示为楷体,同时保持英文原生斜体效果
---
## 🎯 需求对比:为什么你需要这个 CSS
| 场景 | 原生 Obsidian / 普通方案 | 本 CSS 方案 | 解决的问题 |
| --------------- | ------------------ | ----------------------- | --------------------- |
| **中文斜体显示** | 伪斜体(字体拉伸变形) | 真实楷体字形 | 避免中文字符强制拉伸导致的模糊 |
| **中英文混排** | 英文被中文字体覆盖 | 英文保持系统原生斜体 | 提升西文可读性,符合排版规范 |
| **多平台兼容** | 依赖系统特定字体名称 | 自动检测 Win/macOS/Linux 楷体 | 跨平台开箱即用 |
| **代码块保护** | 可能影响代码区字体 | 通过 `unicode-range` 精准控制 | 编程代码不受任何影响 |
| **主题兼容性** | 与某些主题冲突 | 独立字体族 + CSS 变量支持 | 适配 90% 以上 Obsidian 主题 |
---
## ✨ 核心特性
- **智能字体切换**
仅对 `U+4E00-9FFF` 范围的中文字符应用楷体,数字、英文、符号保持原字体
- **双模式支持**
同时在 **编辑模式****阅读模式** 生效
- **嵌套样式兼容**
完美处理 `**粗体 _嵌套斜体_**` 等复杂场景
- **性能优化**
仅 0.5KB 的超轻量级 CSS无外部资源依赖
---
## 🛠️ 安装指南
1. 下载 <a href="/attachments/chinese-italic-kaiti.css" class="internal" data-slug="attachments/chinese-italic-kaiti.css" download="chinese-italic-kaiti.css">chinese-italic-kaiti.css</a>
2. 放入 Obsidian 库的 `.obsidian/snippets/` 目录
3. 启用:设置 → 外观 → CSS 代码片段 → 开启
---
## 🌈 效果预览
![[Pic_20250204.png]]
*上图为开启插件前,下图为开启插件后*
---
## ⚙️ 高级配置
### 自定义字体
```css
/* 修改 @font-face 中的 src 项 */
src: local('您的自定义楷体名称'),
url('自定义字体.woff2');
```
### 调整字符范围
```css
/* 增加注音符号支持 */
unicode-range: U+4E00-9FFF, U+3000-303F, U+31C0-31EF;
```
---
## ❓ 常见问题
**Q为什么某些字符不生效**
A请检查系统是否安装楷体或扩展 `unicode-range` 范围
**Q会拖慢 Obsidian 速度吗?**
A纯 CSS 实现,零性能影响
**Q支持移动端吗**
A完全兼容 iOS/Android 版 Obsidian
---
## 📜 协议许可
[![CC BY 4.0](https://licensebuttons.net/l/by/4.0/80x15.png)](https://creativecommons.org/licenses/by/4.0/)