文件树中实现子级文件夹置顶

hqp · 2026 年5 月 18 日 07:55

问题描述:

我在每个文件夹下都定义了名为 “attachment” 的附件文件夹, 名为 “pic” 的图片文件夹, 专门存储对应内容的附件, 但是由于文件目录的默认排序导致观感差, 例如下图所示:

实现目标

把 “attachment”, “pic” 等指定名称的文件夹在当前目录下置顶

解决方案

感觉挺简单的一个效果还要装插件太过麻烦, 而且目前找了好几个相关的排序插件功能都不够简单, 夹杂了一大堆不需要的设置, 最终决定方案是弄个自定义CSS就行了;

在仓库路径 .obsidian/snippets 下新增一个 CSS 文件, 代码如下

/* 让文件夹容器支持 order 排序（必须加）*/
.nav-files-container,
.nav-folder-children {
    display: flex !important;
    flex-direction: column !important;
}

/* 任意目录下：匹配文件夹名称，同级置顶 */
.nav-folder:has(.nav-folder-title[data-path$="/attachment"]) {
    order: -6 !important;
}
.nav-folder:has(.nav-folder-title[data-path$="/command"]) {
    order: -5 !important;
}
.nav-folder:has(.nav-folder-title[data-path$="/knowledge"]) {
    order: -4 !important;
}
.nav-folder:has(.nav-folder-title[data-path$="/pic"]) {
    order: -3 !important;
}
.nav-folder:has(.nav-folder-title[data-path$="/plugins"]) {
    order: -2 !important;
}
.nav-folder:has(.nav-folder-title[data-path$="/problem"]) {
    order: -1 !important;
}

然后在"设置-外观-CSS代码片段"中启用后生效