丨Obsidian丨设置CSS样式区分文件和文件夹

最新推荐文章于 2025-03-21 15:02:28 发布

数字巫师

最新推荐文章于 2025-03-21 15:02:28 发布

阅读量1.9k

点赞数

文章标签：有道云笔记印象笔记笔记

本文链接：https://blog.youkuaiyun.com/alexsand/article/details/132539056

版权

本文讲述了作者从印象笔记转向Obsidian后，发现其在处理本地大量文献资料时，文件和文件夹默认图标区分不清。作者分享了如何通过CSS文件为Obsidian中的文件夹和文件添加不同图标的方法，以改善目录浏览体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

0x00 背景

博主是个笔记的重度用户，主要用于管理个人知识库，用过有道、为知、印象、Mybase等多种在线和本地笔记，后来长期使用的是印象笔记了。
不过随着对本地管理大量文献资料的需要逐步显现，印象明显难以支撑。最近皈依到了Obsidian：（本地、MD语法、支持索引、支持双向链接）；虽然有各种小问题，但还是瑕不掩瑜。

下面就是一个点：Obsidian显示树状目录时，默认是不区分文件和文件夹的
网上解决方案为：通过css文件进行设置

这里记录一下

0x01 步骤

1、打开当前仓库下的.obsidian文件夹，新建snippets文件夹，里面新建个css文件：custom-icons-differing-files-and-folders.css
2、内容为

.nav-folder-children .nav-file-title-content:first-child::before {
content: "📄 ";
font-family: "IcoMoon-Free";
}

.nav-folder-children .nav-folder-title-content::before {
content: "🗂 ";
font-family: "IcoMoon-Free";
}