Can I use?
› http://caniuse.com/
Less
› http://lesscss.org
Cool Libraries
› Bootstrap from Twitter
› Jetstrap
这是一个创建于 1401 天前的主题，其中的信息可能已经有所发展或是发生改变。
前置说明
- 用了一个 css 样式，让标题显示数字层级。
- 习惯文件标题用一级标题，也就是文章内容的标题默认是二级标题。
需求
- 想要清晰地看清文章结构（大纲视图）。
- 希望左侧大纲保持展开。
问题点
-
大纲模式只认标题。且不认列表内的标题。
-
用标题模式来写（即上半部份的写法）。
- 因为各级标题的大小区分并不明显，不易区分各级标题。虽然可以用 css 去指定颜色区别，但感觉也不够明显。希望有整个标题下属内容，一起缩进的显示。类似代码编辑器括号内{}的效果。子内容缩进个四格。
- 另一个问题是标题模式下，调整层级不便。比如一个三级标题下有若干个四级标题，我如果想把三级升二级去掉一个#就可以了，但下属的所有四级标题也都要改一遍。如果是列表模式，只要一起框选去掉一级缩进就好了。
- 标题模式还有一个问题是层级有限制。
-
用列表模式（下半部分）
- 有缩进层级。但无法在大纲视图显示。如果内文内容量大，还是需要大纲视图。
-
跟思维导图软件的互通
- xmind 之类的大部分用的都是标题模式来划分层级。幕布用的好像是列表模式。
请问
- 有什么 app 能更好地满足编辑同时查看大纲的需求。
- 如果还是用 typora，那么为了大纲，还是考虑用标题模式。那么标题模式下 css 有没有可能实现下属内容的分级缩进？因为列表本身是嵌套的，css 比较好写。标题模式没想好怎么写。
- 编辑时左侧大纲有时会自动缩起来（ mac 版），有办法让它保持展开嘛？
 |
1
JCZ2MkKb5S8ZX9pq OP @old9 大佬麻烦看一眼这个。
简单写了一个缩进，但是遇到点问题。 h2 { margin-left: 0rem !important } h2~* { margin-left: 0rem; } h3 { margin-left: 1rem !important } h3~* { margin-left: 1rem; } h4 { margin-left: 2rem !important } h4~* { margin-left: 2rem; } h5 { margin-left: 3rem !important } h5~* { margin-left: 3rem; } h6 { margin-left: 4rem !important } h6~* { margin-left: 4rem; } ---------- 这样大致上可用，如果文章结构正常按层级来问题不大。 但遇到的问题是，有些情况下缩进错误。效果见图 https://s3.ax1x.com/2021/01/31/yVuRkq.png 比如： ## 2. 二级标题 ### 2.1 四级标题 ## 3. 二级标题 正文 在这样的结构下，期望是 [3. 二级标题] 后面的正文跟随 h2~* { margin-left: 0rem; } 这个属性。但是会被后面 h3~* { margin-left: 1rem; } 这个属性给覆盖掉。 极端情况下，比如上面如果出现一个 h6，那后面不管 h 几下面就都缩进 4rem 了。 请问有没有什么好的方法。 另外 typora 自动计数这个也是第一次看到，不知道有否有类似的原理可以利用。打断一下继承啥的 https://support.typora.io/Auto-Numbering/ |
|
2
JCZ2MkKb5S8ZX9pq OP |
 |
3
old9 2021-02-02 16:21:08 +08:00
就是扁平的 HTML 结构，然后希望 CSS 写出嵌套的缩进效果是吧？这个好像没什么好方法……或者上 JS
|
|
4
JCZ2MkKb5S8ZX9pq OP @old9 嗯，是没想到啥好方法。
它 css 是作为 theme 载入的，对 js 没啥太好的支持。 |
Select Language