同样的，我们之前学习Java需要开发工具eclipse，那么html的学习自然也免不了使用开发工具来进行编写，这样做的目的和Java是一样的，想象一下记事本手写Java的感觉！！
1.HBuilder下载
网址：http://www.dcloud.io/，点击下载即可。
2.新建项目，编写我们第一个HTML
3.运行--》运行到浏览器--》选择对应的浏览器运行，博主的是chrome浏览器，firefox浏览器也可以
1.HBuilder快捷键
[ ///* // # HBuilderX的快捷键理念 // HBuilderX的快捷键原则是：不定义记不住的快捷键 // 过去的很多工具都提供了太多abcd的快捷键，完全记不住 // HBuilderX在定义每个快捷键时都经过了考量，记住如下原则，就可掌握大部分快捷键 // 1. 尽可能保持与OS、浏览器接近 // 比如标签卡管理，与浏览器完全相同，ctrl+t新建标签卡、ctrl+shift+t恢复刚关闭的标签卡、ctrl+w关闭标签卡、ctrl+pagedown/pageup切换标签卡 // 对于习惯eclipse体系ctrl+t寻找文件的用户，需记得寻找文件的快捷键已经调整为ctrl+p // 2. 界面快捷键都与alt相关 // 你可以把键盘方位当做屏幕，q为左上角字母，那么alt+q为显示/关闭左侧的项目管理器 // q旁边的w是文档结构图(大纲)，即alt+q为显示/关闭文档结构图 // 右上角字母是p，即alt+p显示/关闭右侧的预览 // alt+n为置焦编辑器 // alt+x（底部字母）为显示/关闭控制台 // alt+c（底部字母）为显示/关闭终端 // 3. ctrl是操作、ctrl+shift是反操作或更多操作、ctrl+alt为更多操作 // ctrl+k是格式化，那么ctrl+shift+k就是合并为一行 // ctrl+w是关闭当前标签卡，那么ctrl+shift+w是关闭所有标签卡 // ctrl+f是搜索，ctrl+alt+f是目录内搜索 // 5. alt是跳转 // alt+[是在各种括号之间跳转 // alt+d是转到定义（F12也可以），shift+alt+d或shift+F12则是分栏转到定义 // 在windows下，alt+字母同时是菜单的&快捷键，可触发相应菜单功能，比如按下alt+v r，即可展开视图菜单并选中自动换行命令。菜单名称后面括号里的英文，即为对应的触发快捷字母 // 6. 符号化而不是单词字母化 // 包围的英文是surround，但从这个单词里选一个字母配合ctrl等键定为快捷键是很难记住的。ctrl+]是包围，ctrl+shift+]是反包围，这样好记多了 // ctrl+shift+|是给选中行每行设置光标，“|”就是光标的样子，很形象 // 7. 强化和鼠标的配合，更易用 // alt+鼠标滚轮是横向滚动 // alt+鼠标单击是转到定义 // ctrl+鼠标单击是添加多光标 // 鼠标双击可以智能选中，详见选择菜单 // 8. 老HBuilder用户需注意的常见快捷键差异 // 寻找文件从ctrl+t改为ctrl+p // 格式化从ctrl+shift+f改为ctrl+k // 合并行从ctrl+j改为ctrl+shift+k // ctrl+e为选中相同词 // 9. sublime用户需注意常见快捷键差异 // ctrl+d为删除当前行 // ctrl+e为选中相同词 // 打开控制台不是ctrl+~而是alt+x // 合并行从ctrl+j改为ctrl+shift+k // 在每行行首设置光标是ctrl+shift+\而不是ctrl+shift+l // 选择括号内容是ctrl+[而不是ctrl+shift+m // ctrl+]是加包围。除了包围tag还支持包围if等函数块。同时提供ctrl+shift+]为反包围 // 调缩进是tab或shift+tab，不是ctrl+[和] // 选择tag、相同缩进，可以双击tag首尾或缩进符号，不用背快捷键 // 扩大选区是ctrl+= // 复制行或选区是ctrl+insert而不是ctrl+shift+d //*/ //*--------默认快捷键设置，如需修改，请在右侧修改。右侧用户设置会覆盖左侧目录设置--------*// //--------项目管理器-------- //重命名文件（焦点在项目管理器中） {"key":"f2","command":"renameFile"}, //复制文件（焦点在项目管理器中） {"key":"ctrl+c","command":"filesExplorer.copy"}, //粘贴文件（焦点在项目管理器中） {"key":"ctrl+v","command":"filesExplorer.paste"}, //删除 // {"key":"delete","command":"moveFileToTrash"}, //--------标签卡-------- //新建标签卡（默认md） {"key":"ctrl+t","command":"workbench.action.files.newUntitledFile"}, //关闭当前标签卡 {"key":"ctrl+w","command":"workbench.action.closeActiveEditor"}, //关闭当前标签卡 {"key":"ctrl+f4","command":"workbench.action.closeActiveEditor"}, //关闭所有标签卡 {"key":"ctrl+shift+w","command":"workbench.action.closeAllEditors"}, //关闭其他文件 {"key":"ctrl+q","command":"workbench.action.closeOtherEditors"}, //往左一个标签卡 {"key":"ctrl+PgUp","command":"workbench.action.leftTab"}, //往右一个标签卡 {"key":"ctrl+PgDown","command":"workbench.action.rightTab"}, //重开已关闭标签卡 {"key":"ctrl+shift+t","command":"workbench.action.reopenClosedEditor"}, //切换最近的标签卡ctrl+tab，该快捷键无法自定义 //--------文件-------- //新建 {"key":"ctrl+n","command":"workbench.action.menu.new"}, //打开外部文件 {"key":"ctrl+o","command":"workbench.action.files.openFile"}, //打开收藏菜单 {"key": "alt+shift+f","command": "workbench.action.fav.menu"}, //保存 {"key":"ctrl+s","command":"workbench.action.files.save"}, //另存为 {"key":"ctrl+shift+s","command":"workbench.action.files.saveAs"}, //全部保存 {"key":"ctrl+alt+s","command":"workbench.action.files.saveAll"}, //打开文件所在目录 //{"key":"","command":"revealFileInOS"}, //在命令行打开文件所在目录 //{"key":"","command":"revealFileInTerminal"}, //打开文件夹导入项目 //{"key":"","command":"workbench.action.files.openFolder"}, //退出。windows下建议使用系统快捷键Alt+Space C //{"key":"","command":"app.action.quit"}, //--------基础编辑-------- //删除行 {"key":"ctrl+d","command":"editor.action.deleteLines"}, //向左删除词 {"key":"ctrl+backspace","command":"deleteWordLeft"}, //向右删除词 {"key":"ctrl+delete","command":"deleteWordRight"}, //下移一行 {"key":"ctrl+up","command":"editor.action.moveLinesUpAction"}, //上移一行 {"key":"ctrl+down","command":"editor.action.moveLinesDownAction"}, //删到行首 {"key":"shift+backspace","command":"deleteLineLeft"}, //删到行尾 {"key":"shift+delete","command":"deleteLineRight"}, //向下插入行 {"key":"ctrl+enter","command":"editor.action.insertLineAfter"}, //向下插入行。return是小键盘的回车 {"key":"ctrl+return","command":"editor.action.insertLineAfter"}, //向上插入行 {"key":"ctrl+shift+enter","command":"editor.action.insertLineBefore"}, //向上插入行。return是小键盘的回车 {"key":"ctrl+shift+return","command":"editor.action.insertLineBefore"}, //反回车，即把光标前内容移到下一行 {"key":"shift+enter","command":"editor.action.shiftEnter"}, //反回车，即把光标前内容移到下一行。return是小键盘的回车 {"key":"shift+return","command":"editor.action.shiftEnter"}, //删除行尾空白字符 //{"key":"","command":"editor.action.triggerDeleteLineEndSpace"}, //--------列表符操作-------- //插入-无序列表符 {"key":"ctrl+alt+-","command":"editor.action.unOrderListSymbolsByMinus"}, //插入*无序列表符 {"key":"ctrl+alt+8","command":"editor.action.unOrderListSymbolsByMultiply"}, //插入+无序列表符 {"key":"ctrl+alt+=","command":"editor.action.unOrderListSymbolsByPlus"}, //插入>引用列表符 {"key":"ctrl+alt+shift+.","command":"editor.action.quoteListSymbols"}, //插入有序列表符 {"key":"ctrl+alt+1","command":"editor.action.orderListSymbols"}, //插入任务列表符 {"key":"ctrl+alt+[","command":"editor.action.taskListSymbols"}, //插入已完成任务列表符 {"key":"ctrl+alt+]","command":"editor.action.taskFinishListSymbols"}, //--------剪贴板-------- //复制 {"key":"ctrl+c","command":"editor.action.clipboardCopyAction"}, //复制文件路径 {"key":"ctrl+shift+c","command":"editor.action.clipboardCopyPathAction"}, //重复插入选区或当前行 {"key":"ctrl+insert","command":"editor.action.duplicate"}, //重复插入选区或当前行（备份用于没有insert键的键盘） {"key":"ctrl+shift+r","command":"editor.action.duplicate"}, //剪切 {"key":"ctrl+x","command":"editor.action.clipboardCutAction"}, //粘贴 {"key":"ctrl+v","command":"editor.action.clipboardPasteAction"}, //粘贴为HTML {"key":"ctrl+shift+v","command":"editor.action.clipboardPasteAsHTML"}, //从历史粘贴板粘贴（注意解除evernote的快捷键占用） {"key":"ctrl+alt+v","command":"editor.action.clipboardPasteFromHistory"}, //交换选区或行。只支持2个选区或2行 {"key":"ctrl+shift+x","command":"editor.action.swichSelectionOrLine"}, //--------撤销-------- //重做 {"key":"ctrl+y","command":"redo"}, //还原 {"key":"ctrl+z","command":"undo"}, //撤销一个新光标或选区 {"key":"ctrl+shift+z","command":"editor.action.undoSelection"}, //--------语言-------- //格式化 {"key":"ctrl+k","command":"editor.action.format"}, //格式化（兼容老版HBuilder快捷键，注意解除搜狗输入法全局快捷键） {"key":"ctrl+shift+f","command":"editor.action.format"}, //合并行（反格式化） {"key":"ctrl+shift+k","command":"editor.action.joinLines"}, //合并行（兼容老版HBuilder快捷键） {"key":"ctrl+alt+j","command":"editor.action.joinLines"}, //注释/反注释 {"key":"ctrl+/","command":"editor.action.commentLine"}, //块注释 {"key":"ctrl+shift+/","command":"editor.action.blockCommentLine"}, //--------包围-------- //包围 {"key":"ctrl+]","command":"editor.action.SurroundBylanguage"}, //反包围 {"key":"ctrl+shift+]","command":"editor.action.UnSurroundBylanguage"}, //加粗（html、md生效） {"key":"ctrl+b","command":"editor.action.bold"}, //全部字母大写 {"key":"alt+shift+u","command":"editor.action.transformToUppercase"}, //全部字母小写 {"key":"alt+shift+l","command":"editor.action.transformToLowercase"}, //首字母大写 {"key":"alt+shift+t","command":"editor.action.transformToTitlecase"}, //激活代码助手 {"key":"alt+/","command":"editor.action.triggerSuggest"}, //缩进 {"key":"tab","command":"tab"}, //反缩进 {"key":"shift+tab","command":"outdent"}, //--------选择-------- //全选 {"key":"ctrl+a","command":"editor.action.selectAll"}, //向左选词 {"key":"ctrl+shift+left","command":"cursorWordStartLeftSelect"}, //向右选词 {"key":"ctrl+shift+right","command":"cursorWordEndRightSelect"}, //选至行首 {"key":"shift+home","command":"cursorHomeSelect"}, //选至行尾 {"key":"shift+end","command":"cursorEndSelect"}, //选至文档首 {"key":"ctrl+shift+home","command":"selectEditorStart"}, //选至文档尾 {"key":"ctrl+shift+end","command":"selectEditorEnd"}, //选择当前词或下一个相同词 {"key":"ctrl+e","command":"editor.action.addSelectionToNextFindMatch"}, //选择所有相同词 {"key":"ctrl+alt+e","command":"editor.action.selectAllSameWord"}, //跳过当前选择，选中下一个相同词 {"key":"alt+shift+e","command":"editor.action.skipSelectionAndSelectNext"}, //选择相同语法词（注意解除搜狗输入法全局占用） {"key":"ctrl+shift+e","command":"editor.action.SelectSameWordByLan"}, //选择括号内字符。可用双击括号替代 {"key":"ctrl+[","command":"editor.action.selectMatchBracket"}, //选择行。也可单击行号或三击行 {"key":"ctrl+l","command":"expandLineSelection"}, //选择行(不含首尾空白字符)。也可双击行尾 {"key":"ctrl+shift+l","command":"editor.action.selectLineNoBlankStr"}, //放大选区 {"key":"ctrl+=","command":"editor.action.expandSelection"}, //向2侧扩大选择 {"key":"alt+shift+right","command":"editor.action.expandSelectionTwoSides"}, //由2侧向内减少选择 {"key":"alt+shift+left","command":"editor.action.narrowSelectionTwoSides"}, //每个选区前后设置光标 {"key":"ctrl+\\","command":"editor.action.setCursorSurroundSel"}, //每行行首设置光标 {"key":"ctrl+shift+\\","command":"editor.action.setCursorEachLine"}, //选择引号内字符串。可用双击引号来替代 //{"key":"","command":"editor.action.selectMatchQuote"}, //选择相同缩进的行。可用双击行首tab来替代 //{"key":"","command":"editor.action.selectSameIndentationLine"}, //--------查找-------- //查找文件 {"key":"ctrl+p","command":"workbench.action.quickOpen"}, //本文档内查找字符串 {"key":"ctrl+f","command":"actions.find"}, //目录内查找字符串 {"key":"ctrl+alt+f","command":"workbench.action.findInFiles"}, //替换 {"key":"ctrl+h","command":"editor.action.startFindReplaceAction"}, //查找下一个字符串 {"key":"f3","command":"editor.action.nextSelectionMatchFindAction"}, //查找上一个字符串 {"key":"shift+f3","command":"editor.action.previousSelectionMatchFindAction"}, //--------跳转-------- //光标向左一词 {"key":"ctrl+left","command":"gotoWordStartLeft"}, //光标向右一词 {"key":"ctrl+right","command":"gotoWordStartRight"}, //光标到行首 {"key":"home","command":"gotoWordLineHome"}, //光标到行尾 {"key":"end","command":"gotoWordLineEnd"}, //光标到页首 {"key":"ctrl+home","command":"gotoEditorStart"}, //光标到页尾 {"key":"ctrl+end","command":"gotoEditorEnd"}, //转到定义 {"key":"alt+d","command":"workbench.action.gotoDefinition"}, {"key":"f12","command":"workbench.action.gotoDefinition"}, //分栏转到定义 {"key":"alt+shift+d","command":"workbench.action.gotoDefinitionWithPane"}, {"key":"shift+f12","command":"workbench.action.gotoDefinitionWithPane"}, //跳转到行 {"key":"ctrl+g","command":"workbench.action.gotoLine"}, //跳转到配对的括号 {"key":"alt+[","command":"editor.action.jumpToBracket"}, //光标后退 {"key":"alt+left","command":"workbench.action.navigateBack"}, //光标前进 {"key":"alt+right","command":"workbench.action.navigateForward"}, //光标历史清空 //{"key":"","command":"workbench.action.clearPosHistory"}, //设置/取消书签 {"key":"ctrl+f2","command":"workbench.action.toggleBookmark"}, //下一个书签（光标在编辑器区域） {"key":"f2","command":"workbench.action.nextBookmark"}, //上一个书签（光标在编辑器区域） {"key":"shift+f2","command":"workbench.action.prevBookmark"}, //清除所有书签 {"key":"ctrl+shift+f2","command":"workbench.action.clearBookmarks"}, //下一个验证错误 {"key":"f4","command":"workbench.action.nextError"}, //上一个验证错误 {"key":"shift+f4","command":"workbench.action.prevError"}, //折叠单行 {"key":"alt+-","command":"workbench.action.foldLineContract"}, //展开单行 {"key":"alt+=","command":"workbench.action.foldLineExpand"}, //折叠子行 {"key":"alt+shift+-","command":"workbench.action.foldChildrenContract"}, //展开子行 {"key":"alt+shift+=","command":"workbench.action.foldChildrenExpand"}, //折叠所有行 {"key":"alt+ctrl+shift+-","command":"workbench.action.foldAllContract"}, //展开所有行 {"key":"alt+ctrl+shift+=","command":"workbench.action.foldAllExpand"}, //折叠其他区域 {"key":"alt+shift+o","command":"workbench.action.foldContractOther"}, //转到Page.json（在uni-app的page页面可快速转到Page.json里对应的节点） //{"key":"","command":"workbench.action.openPageJsonFile"}, //--------视图-------- //置焦到编辑器区域 {"key":"alt+n","command":"workbench.action.focusEditor"}, //显示/隐藏项目管理器 {"key":"alt+q","command":"workbench.action.toggleSidebarVisibility"}, //显示/隐藏控制台 {"key":"alt+x","command":"workbench.debug.action.toggleRepl"}, //显示/控制台 {"key":"alt+c","command":"workbench.action.tiggleTerminal"}, //显示/隐藏工具栏 {"key":"alt+o","command":"workbench.action.toggleToolbarVisibility"}, //显示/隐藏内置浏览器 {"key":"alt+p","command":"workbench.action.togglePreviewBrowserVisibility"}, //显示/隐藏大纲 {"key":"alt+w","command":"editor.action.triggerOutline"}, //显示/隐藏状态栏 //{"key":"","command":"workbench.action.toggleStatusbarVisibility"}, //增大字体【ctrl+鼠标滚动向上】 {"key":"ctrl+shift+=","command":"workbench.action.zoomIn"}, //减小字体【ctrl+鼠标滚动向下】 {"key":"ctrl+shift+-","command":"workbench.action.zoomOut"}, //单栏 {"key":"alt+shift+1","command":"workbench.action.split1e"}, //左右2栏 {"key":"alt+shift+2","command":"workbench.action.split2e"}, //左右3栏 {"key":"alt+shift+3","command":"workbench.action.split3e"}, //置焦到下一个分栏 {"key":"alt+.","command":"workbench.action.nextpane"}, //置焦到上一个分栏 {"key":"alt+,","command":"workbench.action.prevpane"}, //免打扰模式 //切换是否自动换行 //{"key":"","command":"editor.action.toggleWordWrap"}, //显示/隐藏行号 //{"key":"","command":"editor.action.toggleRenderLineNumber"}, //显示/隐藏缩进线 //{"key":"","command":"editor.action.toggleRenderIndentReference"}, //显示/隐藏空白字符 //{"key":"","command":"editor.action.toggleRenderWhitespace"}, //在项目管理器中追踪/不追踪当前文件位置 //{"key":"","command":"editor.action.revealInProjectExplorer"}, //新建HBuilder窗体 //{"key":"","command":"workbench.action.newWindow"}, //--------运行-------- //运行 {"key":"ctrl+r","command":"app.action.rundevice"} //--------帮助-------- //重新加载代码块 //{"key":"","command":"workbench.action.reloadSnippets"}, //打开设置 //{"key":"","command":"workbench.action.openGlobalSettings"}, //打开快捷键设置 //{"key":"","command":"workbench.action.openGlobalKeybindings"}, //打开外部命令设置 //{"key":"","command":"workbench.action.openGlobalExternalcommands"}, //显示日志文件 //{"key":"","command":"workbench.action.openlog"}, //反馈 //{"key":"","command":"workbench.action.feedback"}, //显示更新日志 //{"key":"","command":"update.showCurrentReleaseNotes"}, //检查更新 //{"key":"","command":"update.checkForUpdate"}, //*----以下为鼠标配合快捷键说明，不可自定义----*// // ctrl +左键单击 添加多光标 // ctrl +右键单击 删除多光标 // ctrl +左键拖选 添加多选区 // ctrl +左键双击 如果点击到了智能双击区域比如if块，会添加到选区里 // alt +左键单击 转到定义/打开链接 // alt+ctrl +左键单击 分栏转到定义/打开链接 // alt +左键拖选 列选择 // ctrl +滚轮 缩放字体 // alt +滚轮 横向滚动 // shift +滚轮 垂直滚动一屏 // ctrl+alt +滚轮 横向滚动一屏 ]
