建议选择安装版,方便升级。
其它: Dreamweaver CC 2017,或者 Adobe Brackets,或者需要自己装配的 Sublime Text 3。
Emmet
务必熟悉 Emmet
Markdown
写笔记务必用 Markdown 语法
快速入门,CSDN博客的Markdown语法帮助
快捷键
先看软件本身的快捷键,然后再自定义快捷键。
打开多窗口,一边对着 键盘快捷方式 敲一遍。
不建议五花八门的弄。
// 将键绑定放入此文件中以覆盖默认值
[{ // 选择全部匹配项=
"key": "ctrl+shift+l",
"command": "editor.action.selectHighlights",
"when": "editorFocus"
},
{ // 包裹符前后跳转
"key": "alt+\\",
"command": "editor.action.jumpToBracket",
"when": "editorTextFocus"
},
{
"key": "ctrl+shift+b",
"command": "workbench.action.tasks.build"
},
{
"key": "ctrl+shift+f9",
"command": "workbench.debug.viewlet.action.removeAllBreakpoints"
},
{ // 删除末尾空白字符
"key": "shift+backspace",
"command": "editor.action.trimTrailingWhitespace",
"when": "editorTextFocus && !editorReadonly"
},
{ // 显示空白字符
"key": "alt+backspace",
"command": "editor.action.toggleRenderWhitespace"
},
{ // 删除右边字符
"key": "ctrl+delete",
"command": "deleteWordEndRight"
},
{ // 删除左边字符
"key": "ctrl+backspace",
"command": "deleteWordStartLeft"
},
{ // 输出
"key": "ctrl+alt+o",
"command": "workbench.action.output.toggleOutput"
},
{ // 打开文件位置
"key": "alt+x",
"command": "workbench.action.files.revealActiveFileInWindows"
},
{ // 在新窗口打开当前文件
"key": "ctrl+k ctrl+o",
"command": "workbench.action.files.showOpenedFileInNewWindow"
},
{ // 保存所有
"key": "ctrl+k ctrl+s",
"command": "workbench.action.files.saveAll"
},
{ // 插入代码段
"key": "ctrl+k ctrl+x",
"command": "insertSnippet"
},
{ // 文本转大写
"key": "ctrl+k ctrl+u",
"command": "editor.action.transformToUppercase",
"when": "editorTextFocus"
},
{ // 文本转小写
"key": "ctrl+k ctrl+l",
"command": "editor.action.transformToLowercase",
"when": "editorTextFocus"
},
{ // markdown 预览
"key": "ctrl+k ctrl+v",
"command": "markdown.showPreviewToSide",
"when": "editorFocus"
},
{ // 剪切行到粘贴版
"key": "ctrl+l",
"command": "editor.action.clipboardCutAction",
"when": "editorTextFocus && !editorReadonly && editorHasSelection"
},
{ // 块级注释
"key": "ctrl+shift+/",
"command": "editor.action.blockComment",
"when": "editorTextFocus && !editorReadonly"
},
{ // 智能提示
"key": "ctrl+alt+space",
"command": "editor.action.triggerSuggest",
"when": "editorHasCompletionItemProvider && editorTextFocus && !editorReadonly"
},
{ // 选中文本,行排序:升
"key": "f9",
"command": "editor.action.sortLinesAscending",
"when": "editorTextFocus"
},
{ // 选中文本,行排序:渐
"key": "ctrl+f9",
"command": "editor.action.sortLinesDescending",
"when": "editorTextFocus"
},
{ // 合并为一行
"key": "ctrl+j",
"command": "editor.action.joinLines",
"when": "editorTextFocus"
},
{
"key": "ctrl+shift+j",
"command": "workbench.action.togglePanel"
},
{ // ZenMode
"key": "ctrl+k ctrl+z",
"command": "workbench.action.toggleZenMode"
},
// ## plugin
// emmet
{ // 更新标签对
"key": "ctrl+shift+;",
"command": "editor.emmet.action.updateTag",
"when": "editorTextFocus"
},
{ // 移除标签对
"key": "ctrl+shift+'",
"command": "editor.emmet.action.removeTag",
"when": "editorTextFocus"
},
{ // HTML添加外围包裹标签
"key": "ctrl+shift+g",
"command": "editor.emmet.action.wrapWithAbbreviation",
"when": "editorTextFocus"
},
{ // HTML、CSS中由内向外逐层级选择
"key": "alt+shift+,",
"command": "editor.emmet.action.balanceOutward",
"when": "editorTextFocus"
},
{ // HTML、CSS中由外向内逐层级选择
"key": "alt+shift+.",
"command": "editor.emmet.action.balanceInward",
"when": "editorTextFocus"
},
{ // HTML、CSS中以“标签|选择器、属性、值”步进选择(向上)
"key": "alt+,",
"command": "editor.emmet.action.selectPreviousItem",
"when": "editorTextFocus"
},
{ // HTML、CSS中以“标签|选择器、属性、值”步进选择(向下)
"key": "alt+.",
"command": "editor.emmet.action.selectNextItem",
"when": "editorTextFocus"
},
{ // HTML中上一编辑点
"key": "ctrl+alt+,",
"command": "editor.emmet.action.previousEditPoint",
"when": "editorTextFocus"
},
{ // HTML中下一编辑点
"key": "ctrl+alt+.",
"command": "editor.emmet.action.nextEditPoint",
"when": "editorTextFocus"
},
{ // HTML中对标签始尾跳转
"key": "ctrl+alt+\\",
"command": "editor.emmet.action.matchingPair",
"when": "editorTextFocus"
},
{ // 类计算器功能
"key": "ctrl+alt+shift+c",
"command": "editor.emmet.action.evaluateMath",
"when": "editorTextFocus"
},
{ // 更新或添加图片尺寸
"key": "ctrl+i ctrl+u",
"command": "editor.emmet.action.updateImageSize",
"when": "editorTextFocus"
},
// bookmarks
{// 添加/取消书签
"key": "ctrl+k ctrl+k",
"command": "bookmarks.toggle",
"when": "editorTextFocus"
},
{// 下一书签
"key": "ctrl+k ctrl+n",
"command": "bookmarks.jumpToNext",
"when": "editorTextFocus"
},
{// 上一书签
"key": "ctrl+k ctrl+p",
"command": "bookmarks.jumpToPrevious",
"when": "editorTextFocus"
},
{// 清除当前文档所有书签
"key": "ctrl+k ctrl+c",
"command": "bookmarks.clear",
"when": "editorTextFocus"
},
{// 当前文档所有书签列表
"key": "ctrl+k ctrl+l",
"command": "bookmarks.list",
"when": "editorTextFocus"
},
// beautify
{ // 格式化文档
"key": "alt+d",
"command": "HookyQR.beautify",
"when": "editorFocus"
}
]
设置
// 将设置放入此文件中以覆盖默认设置
{
"editor.fontSize": 16,
"editor.tabSize": 4,
"files.exclude": {
"**/.git": true,
"**/.svn": true,
"**/.hg": true,
"**/.DS_Store": true,
"**/node_modules": true
},
"editor.dragAndDrop": true,
"editor.minimap.enabled": true,
"editor.renderWhitespace": "all",
"editor.selectionHighlight": false,
"editor.wordWrap": "on",
"files.trimTrailingWhitespace": true,
"sync.anonymousGist": false,
"sync.autoDownload": false,
"sync.autoUpload": false,
"sync.forceDownload": false,
"sync.showSummary": true,
"sync.version": 262,
"window.zoomLevel": 0,
"workbench.activityBar.visible": false,
"explorer.autoReveal": false,
"sync.host": "",
"sync.pathPrefix": "",
"workbench.iconTheme": "material-icon-theme"
}
插件
- Beautify
- Bookmarks
- CSScomb
- Document this
- Emoji
- IntelliSense for CSS class names
- jQuery Code Snippets
- Material Icon Theme
- Settings Sync
- XML tools
欢迎补充
Emmet API
鼠标右键查看大图
Emmet-API-HTML
Emmet-API-CSS
Emmet-API-Syntax
Emmet-API-XSL