modular-css-layout 插件 cheatsheet
- GitHub:GitHub - efemkay/obsidian-modular-css-layout: CSS Layout hack for Obsidian.md
- WIKI:Getting Started | Modular CSS Layout
Multi Column
- 使用
[!<anycallout>|<left-or-right>-<size>]仅影响阅读视图,或使用[!<anycallout>|float-<left-or-right>-<size>]也适用于实时预览。 - 示例:
[!info|float-right-medium][!blank|right-small][!multi-column|right-fixed-medium][!multi-column|center-fixed-small][!multi-column|no-wrap]
| callout | Apply in LP? | Which Side? | Preset FC Size |
|---|---|---|---|
[!multi-column] 多列布局[!blank-container] 不可见容器[!note] / [!abstract] / [!info][!todo] / [!tip] / [!success][!question] / [!warning][!failure] / [!danger] / [!bug][!example] / [!quote] |
<empty> float |
leftrightcenter |
small medium large |
Multi Column Callout
> [!multi-column]
>
> > [!note]+ Use Case
> > Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
> >
> > ##### User Case Background
> >
> > Vitae nunc sed velit dignissim sodales. In cursus turpis massa tincidunt dui ut ornare lectus.
>
> > [!warning]+ Resources
> >
> > #### Requirement
> >
> > - Lorem ipsum dolor sit amet
> > - Vitae nunc sed velit dignissim sodales.
> > - In cursus turpis massa tincidunt dui ut ornare lectus.
>
> > [!todo]+
> >
> > - [x] Define Use Case
> > - [ ] Craft User Story
> > - [ ] Develop draft sketches
Multi-column
Use Case
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
User Case Background
Vitae nunc sed velit dignissim sodales. In cursus turpis massa tincidunt dui ut ornare lectus.
Resources
Requirement
- Lorem ipsum dolor sit amet
- Vitae nunc sed velit dignissim sodales.
- In cursus turpis massa tincidunt dui ut ornare lectus.
Todo
[!multi-column]多列[!multi-column|center-fixed]用于居中对齐[!multi-column|left-fixed]用于向左对齐[!multi-column|right-fixed]用于右对齐[!multi-column|no-wrap]不换行多列
- 宽度控制
min-0覆盖并禁用样式设置中设置的最小宽度wide-2标注尺寸为两倍wide-3三倍大小wide-4四倍大小wide-5五倍大小
## Icon Links Dashboard using `[!multi-column|center-fixed-small]`
> [!multi-column|center-fixed-small]
>
>> [!blank|center]
>> [ <br/> Interests](target%20note.md)
>>
>> [ <br/> Technology](target%20note.md)
>
>> [!blank|center]
>> [ <br/> Life & Wisdom](target%20note.md)
>>
>> [ <br/> Work](target%20note.md)
>
>> [!blank|center]
>> [ <br/> Health](target%20note.md)
>>
>> [ <br/> Family](target%20note.md)