obsidian外观
右键菜单分栏，让你的菜单更美观、更高效
插件ID：obsidian%E6%A0%B7%E5%BC%8F-%E5%8F%B3%E9%94%AE%E8%8F%9C%E5%8D%95%E5%88%86%E6%A0%8F%E8%AE%A9%E4%BD%A0%E7%9A%84%E8%8F%9C%E5%8D%95%E6%9B%B4%E7%BE%8E%E8%A7%82%E6%9B%B4%E9%AB%98%E6%95%88
obsidian%E6%A0%B7%E5%BC%8F-%E5%8F%B3%E9%94%AE%E8%8F%9C%E5%8D%95%E5%88%86%E6%A0%8F%E8%AE%A9%E4%BD%A0%E7%9A%84%E8%8F%9C%E5%8D%95%E6%9B%B4%E7%BE%8E%E8%A7%82%E6%9B%B4%E9%AB%98%E6%95%88
obsidian%E6%A0%B7%E5%BC%8F %E5%8F%B3%E9%94%AE%E8%8F%9C%E5%8D%95%E5%88%86%E6%A0%8F%E8%AE%A9%E4%BD%A0%E7%9A%84%E8%8F%9C%E5%8D%95%E6%9B%B4%E7%BE%8E%E8%A7%82%E6%9B%B4%E9%AB%98%E6%95%88：右键菜单分栏，让你的菜单更美观、更高效
右键菜单分栏，让你的菜单更美观、更高效
在日常使用 Obsidian 时，右键菜单是我们快速执行操作的重要工具。然而，随着插件和功能的增加，右键菜单可能会变得非常冗长，导致浏览和选择变得繁琐。今天，我将分享一个超实用的技巧——如何通过自定义 CSS 代码，实现 Obsidian 右键菜单的自动分栏，让你的菜单更美观、更高效！
效果展示
CSS 代码
/* 右键菜单栏分栏 */
.menu:not(.MySnippets-statusbar-menu):has(>.menu-item:nth-child(n+20)),
.menu:not(.MySnippets-statusbar-menu)>.menu-scroll:has(>.menu-item:nth-child(n+20)) {
display: block;
columns: 2;
gap: 5px;
column-rule: 2px solid var(--background-modifier-border);
width: fit-content;
}
.menu:not(.MySnippets-statusbar-menu):has(>.menu-item:nth-child(n+40)),
.menu:not(.MySnippets-statusbar-menu)>.menu-scroll:has(>.menu-item:nth-child(n+40)) {
columns: 3;
}
.menu:not(.MySnippets-statusbar-menu):has(>.menu-item:nth-child(n+60)),
.menu:not(.MySnippets-statusbar-menu)>.menu-scroll:has(>.menu-item:nth-child(n+60)) {
columns: 4;
}
.menu:not(.MySnippets-statusbar-menu):has(>.menu-item:nth-child(n+80)),
.menu:not(.MySnippets-statusbar-menu)>.menu-scroll:has(>.menu-item:nth-child(n+80)) {
columns: 5;
}
.menu:not(.MySnippets-statusbar-menu):has(>.menu-item:nth-child(n+100)),
.menu:not(.MySnippets-statusbar-menu)>.menu-scroll:has(>.menu-item:nth-child(n+100)) {
columns: 6;
}
/* 隐藏分割线 */
.menu-separator {
display: none;
}自动分栏规则
- 菜单项超过 20 个时，自动切换为 2 列。
- 菜单项超过 40 个时，切换为 3 列。
- 菜单项超过 60 个时，切换为 4 列。
- 菜单项超过 80 个时，切换为 5 列。
- 菜单项超过 100 个时，切换为 6 列。
通过这些规则，右键菜单会根据菜单项的数量自动调整列数，确保菜单始终保持最佳的可读性和操作性。
讨论
若阁下有独到的见解或新颖的想法，诚邀您在文章下方留言，与大家共同探讨。
