HBuilderX上⼀个不错的markdown⼊门教程markdown - 更简洁、更⾼效
====================================================
强烈建议开发者认真阅读本⽂档,掌握md及HBuilderX对md的强⼤⽀持。
窄屏幕下,可按Alt+滚轮横向滚动
很多⼈只把markdown⽤于⽹络⽂章发表,这糟蹋了markdown。
markdown不⽌是HTML的简化版,更重要的是txt的升级版、word的轻量版、笔记的最佳载体。
作为⼀种简单的格式标记语⾔,不同于txt的⽆格式,不同于HTML的复杂标记,也不同于word的⿏标调整样式。markdown通过简单的⼏个字符键⼊,就可以快捷的定义⽂档的样式。并且在HBuilderX⾥有直观完善的着⾊,这样⽆需发布为web页⾯,可直接当word⽤。
掌握markdown,你可以完全抛弃txt和笔记软件的编辑器,并且在⼤多数场景下替代掉复杂臃肿的word。享受简洁之美、享受效率提升。
下⾯的⽰例列举了markdown语法及对应的HBuilderX使⽤技巧:
标题语法
markdown的标题是⾏⾸以#号开头,空格分割的,不同级别的标题,在HX⾥着⾊也不同。如下:
# 标题1
## 标题2
### 标题3
#### 标题4
> 标题5
># 标题6
标题使⽤技巧:
1. Emmet快速输⼊:敲h2+Tab即可⽣成⼆级标题【同HTML⾥的emmet写法,不⽌标题,HX⾥所有可对应tag的markdown语法均⽀持emmet
写法】。仅⾏⾸⽣效
2. 智能双击:双击#号可选中整个标题段落
3. 智能回车:⾏尾回车或⾏中Ctrl+Enter强制换⾏后会⾃动在下⼀⾏补#。⽽连续2次回车后将⾃动补的#去掉。(体验同word)
4. 回车后再次按Tab可递进⼀层标题,再按Tab切换列表
5. 在# 后回车,可上插⼀个空标题⾏【同word】,或任意位置按Ctrl+Shift+Enter也可以上插空标题⾏
6. 折叠:
点标题前的-号可折叠该标题段落,快捷键是Alt+-(展开折叠是Alt+=)
多层折叠时折叠或展开⼦节点,快捷键是Alt+Shift+-或=
全⽂全部折叠或展开,快捷键是Ctrl+Alt+Shift+-或=
折叠其他区域,快捷键是Alt+Shift+o。这对长⽂档管理⾮常有⽤,可以专注于当前章节
可以在菜单-跳转-折叠中随时到这些功能
列表
markdown的列表⽀持有序列表、⽆序列表以及特殊的任务列表。
图片编辑器app同样也是在⾏前加⼀个特殊符号,并空格后再跟列表⽂字内容。
有序列表
有序列表就是有顺序的列表,依靠⾏前的数字标记顺序。
1. 有序列表1 【设置或取消有序列表符的快捷键:Ctrl+Alt+1,可选中多⾏批量设置序号;⽀持多光标批量设置列表符,即按Ctrl+⿏标左键添加多光标】
2. 有序列表2 【列表后回车会⾃动补序号】
4. 有序列表3 【智能双击:双击前⾯的数字,可重新对数字排序,修正序号错误,并选中有序列表段落(左边的4是故意写错让你体验的)】
⽆序列表
⽆序列表就是列表不排序,⽆序列表因书写随意⽽被更⼴泛的使⽤。
⽆序列表有3种前缀,HX⾥分别⽤于表⽰1级列表、2级列表、3级列表。
- ⽆序列表1 【快捷键:Ctrl+Alt+-;智能双击:双击-号可选中整段⽆序列表;再次按Tab会更换⼆级列表符】
* ⽆序列表2
* Emmet:li后敲Tab可⽣成*号列表符,⾏⾸⽣效
* 快捷键:Ctrl+Alt+8【8即*对应的数字】,⽀持多光标批量设置列表符,即按Ctrl+⿏标左键添加多光标
* 智能双击:双击*号可选中整段⽆序列表
* 智能回车:⾏尾回车或⾏中Ctrl+Enter强制换⾏后会⾃动续列表;连续按回车会清除列表符;再次按Tab会更换列表符;在列表符后回车或⾏尾Shift+回车,上⼀⾏留出列表符 * *号常⽤于⼆级列表,列表符后继续Tab,可切换列表符
+ ⽆序列表3 【快捷键:Ctrl+Alt+=;常⽤于三级列表;其他同上】
任务列表
任务列表⾮常实⽤,管理待办、已办⾮常便利。
[ ] 任务列表-未完成任务【快捷键:Ctrl+Alt+[】
[x] 任务列表-已完成任务【快捷键:Ctrl+Alt+]】
1. 智能双击:双击⽅括号内可切换勾选状态,把任务标记为完成或未完成;双击⽅括号右侧可选中任务列表段落
2. 智能回车:回车后⾃动补任务列表前缀符号;连续按回车清除前缀符号;在列表符后回车或⾏尾Shift+回车,上⼀⾏留出列表符
- [ ] 如需发布到web渲染,需增加⽆序列表- 的前缀
以上三种列表,均⽀持批量修改列表符,有如下⽅式建议依次学习尝试:
1. 选中多⾏,按快捷键Ctrl+Alt+“1”或“-”或“[”或“]”,批量设置列表符
2. 如果需要跳⾏设置有序或⽆序列表,通过Ctrl+⿏标左键点中⽬标多⾏(可不连续),产⽣多光标,然后按快捷键Ctrl+Alt+“1”或“-”或“[”或“]”,
可跳⾏设置列表符,尤其是有序列表,数字也会跳⾏加1
3. 按Alt+⿏标选中⾏⾸那列(列选择),这样每⾏⾏⾸都有光标,然后再键⼊或删除列表符即可批量操作
4. 选中多⾏,按快捷键Ctrl+Shift+\(其实就是Ctrl+|),可以在每⾏⾏⾸添加⼀个光标
引⽤列表
> 引⽤1
> 引⽤2
快捷键:Ctrl+Alt+Shift+.
智能双击:双击>号可选中整段引⽤列表
智能回车:⾏尾回车或⾏中Ctrl+Enter强制换⾏后会⾃动续列表;连续按回车会清除列表符;在列表符后回车或⾏尾Shift+回车,上⼀⾏留出列表符
⽂字样式语法
**加粗1** 【快捷键:Ctrl+B,⽀持多光标;Emmet:b后敲Tab】
__加粗2__
_倾斜_【Emmet:i后敲Tab;前后包围:选中⽂字按Ctrl+\是在选区两侧添加光标,可以继续输⼊_】
*倾斜*
~~删除线~~
``` 单⾏代码 ```
包围插⼊:先选中⽂字内容,然后按_*~`等符号,会⾃动在2侧加包围
智能双击:双击语法区前⾯的定义符号,选中包含定义符的整段⽂字
去包围:选中整段⽂字后,按Ctrl+Shift+],可去除2侧包围符号
引号括号虽然不属于markdown语法,但也⽀持相同的包围、选择、去包围操作。
引号括号智能双击选择时略特殊的是:双击引号括号内侧,选中引号括号⾥的内容(不含引号括号);按下Alt+双击引号括号内侧,则选中包含符号的整段⽂字
HBuilderX还⽀持以下对2侧⽂本⾼效处理的⼿段
1. 选中⽂字按Ctrl+\是在选区两侧添加光标,可以继续输⼊~~,会在2侧同时输⼊
2. 向2侧扩⼤选择:【Win:Alt+Shit+→、Mac:Ctrl++Shit+→】;由2侧向内减少选择:【Win:Alt+Shit+←、Mac:Ctrl++Shit+←】
[链接⽂字](dcloud.io)
1. Emmet:a后敲Tab
2. 打开链接:Alt+⿏标单击;如果是本地⽂件,可通过Shift+Alt+单击,在另⼀分栏打开⽂件
3. 智能粘贴:粘贴URL会⾃动变成超链接格式;粘贴本地⽂件进来也会⾃动创建引⽤链接
4. 智能双击:双击语法区开头,即[左侧,选中包含定义符的整段⽂字
![图⽚描述⽂字](logo.jpg)
1. Emmet:img后敲Tab
2. 智能粘贴:粘贴剪切板⾥的图形时会⾃动保存为本md⽂档的附件;删除⽂档中的图⽚语法,保存md⽂档时会⾃动删除对应的图⽚附件;粘贴图⽚⽂件时⾃动变成链接引⽤格式;
3. 悬浮预览:⿏标移到图⽚语法上,本地图⽚会⾃动显⽰出来
4. 智能双击:双击语法区开头,即!左侧,选中包含定义符的整段⽂字
表格
|  |        |  |
|-- |-- |-- |
|  |        |        |
|        |        |        |
1. Emmet:table3*3后敲Tab,表⽰⽣成3⾏3列的表格,⾏⾸⽣效
2. md表格对齐是传统md的痛点,按下Ctrl+K可以⾃动整理表格格式(暂未兼容不同缩放模式和字体的情况)
3. ⽀持从excel、wps、word、number的表格中复制粘贴表格进来(不⽀持合并单元格和单元格换⾏)
分割线
------------- 【Emmet:hr后敲Tab】
*************
=============
代码区
``` javascript
var a = document
```
Emmet:code后敲Tab,⾏⾸⽣效
智能双击:双击语法区开头,即!左侧,选中包含定义符的整段⽂字
⽀持代码直接⾼亮着⾊,这应该是只有HBuilderX才有的功能。注意需要在代码区开头指定语⾔类型
注释
<!--注释-->
快捷键:Ctrl+/
智能双击:双击注释⾸尾的定义符,选中整段注释
其他emmet快捷输⼊
day后敲Tab,当前⽇期。注意day需在⾏⾸或前⾯有空格
time后敲Tab,当前时间。注意time需在⾏⾸或前⾯有空格
⽂档结构图
⽂章很长时,word⾥有⽂档结构图,HBuilderX也有。
菜单视图-⽂档结构图,快捷键Alt+W(mac是ctrl+W),轻松管理长⽂档
运⾏、预览和打印PDF
对md⽂件点⼯具栏或菜单⾥的浏览器运⾏,可以使⽤外部浏览器预览此md⽂件,会⾃动渲染为HTML。
点右上⾓的预览【快捷键Alt+p】,可在HBuilderX右侧预览该md⽂档的HTML渲染结果。
在浏览器中点打印,选择打印到PDF,可将md输出为PDF格式。(注意在打印选项⾥去掉页眉页脚)
⼀键分享
markdown拥有迷⼈的输⼊体验,但分享并不⽅便,尤其是缺少免费、稳定、⾼速的图床。
提供了免费、稳定、⾼速的服务器和cdn。
HBuilderX,基于uniCloud,提供了markdown的⼀键分享功能。
利⽤uniCloud的前端⽹页托管,将markdown稳定转成了HTML⽹页,并发布为在线的URL。您可以把URL发送给任何想要分享的⼈。同时markdown⾥涉及的图⽚也会⾃动上传到前端⽹页托管⾥免费cdn中。
更多见:
其他常⽤但你可能不知道的快捷操作技巧
Ctrl+⿏标左键添加多光标,然后敲字或粘贴,可批量处理。Ctrl+⿏标左键拖选,可选中多个选区。
Ctrl+⿏标右键删除多光标
不选内容按Ctrl+C或X可复制或剪切整⾏
选中2个选区后,按Ctrl+Shift+X,可互换选区内容。如⽆选区,只是2个光标,则互换2⾏
Ctrl+上下键可上下移动⾏
Ctrl+Insert可重复插⼊当前⾏,如果有选中内容,可重复插⼊选中内容
Ctrl+Shift+K可合并多⾏(是格式化Ctrl+K的反操作)
删除
按Ctrl+D可删除选中⾏,⽀持多光标
Shift+Del删除到⾏尾
Shift+Backspace删除到⾏⾸
选择
Ctrl+E选相同词(mac是Command+D),连续按可选中多词进⼀步操作,⽐替换更⽅便
Ctrl+L可连选多⾏,Ctrl+Shift+L也是选择⾏,但不选⾏⾸尾的空⽩字符
Ctrl+=可逐级放⼤选区
双击标题、列表符可选中相应段落
双击英⽂引号、括号内侧,可选中内部内容
双击缩进符,可选中同缩进段落
双击连字符⽐如-或_,可选中相连的词,⽐如双击这⾥试试,uni-app
Ctrl+P查⽂件
Ctrl+Alt+F可在当前⽬录的所有⽂档中搜索指定关键字(mac是Command+Shift+f)
选中⽂字按F3,查下⼀个,Shift+F3上⼀个
云同步:HBuilderX+markdown⽤于云同步笔记的技巧,请参考
都学会了吗?
markdown语法其实很简单,认真学半⼩时就能掌握。
HBuilderX的极客操作则需要不停反复练习,熟练掌握这些技巧,你将成为⾼效极客!