为了账号安全,请及时绑定邮箱和手机立即绑定

前端开发工具技巧介绍—Sublime篇

难度入门
时长 1小时 0分
学习人数
综合评分9.70
730人评价 查看评价
9.9 内容实用
9.7 简洁易懂
9.5 逻辑清晰
  • 有个东西老师没讲,觉得挺有用的。。当工作量较大时。。。 alt+shift+2 将sublime Text拆成左右两块 alt+shift+4则拆成从左到右四块 alt+shift+8则拆成上下两块 alt+shift+9则拆成上下三块 从左到右两到三块已经够用。。
    查看全部
  • 1.切换语言格式,ctrl+shirt+p 2.简化操作 ctrl+shirt+p 输入 snippet:function 自动生成function的基本结构! tab键 移动光标到下一个词 自动补全功能,输入前几个英文字母,按enter 自动生成一段代码结构! 3.输入前一个英文字母,按enter生成一段代码 4.安装 javascript& nodejs snippets以及jQuery插件, ,很方便的提高生产力,具体指令说明:https://packagecontrol.io/packages/JavaScript%20%26%20NodeJS%20Snippets ,https://packagecontrol.io/packages/jQuery 1.[ctrl+shift+P]+輸入'pci'+輸入'Snippet: Function' 2.輸入'fun'+[Enter],自動產生 function 3.輸入'ife',自動產生 if else JavaScript snippets 1.[ctrl+shift+P]+輸入'pci'+輸入'JavaScript Completions' 2.輸入'gi',自動產生 getElementById JQuery snippets 1.[ctrl+shift+P]+輸入'pci'+輸入'JQuery' 2.輸入'get',自動產生 get請求 3.輸入'post',自動產生 post請求 Insert Callback 1.[ctrl+shift+P]+輸入'pci'+輸入'Insert Callback' 2.[alt+C],自動產生 callBack function
    查看全部
  • 关于emmet插件的安装,要先在package control的官网上拷贝sublime text3的package control的安装代码https://packagecontrol.io/,然后回到sublime text3 的view中show codes中将安装的代码粘贴,enter键进行安装。 package control安装完后,用ctrl + shift + p调用出命令面板,输入pci就会出现package control install package,点击回车,出现新的命令窗口,输入emmet就可以加载emmet插件,还有其他javascript & Nodejs javascript等插件。
    查看全部
  • Ctrl+Shift+A 选择光标位置父标签对儿 Ctrl+Shift+[ 折叠代码 Ctrl+Shift+] 展开代码 Ctrl+KT折叠属性 Ctrl+K0展开所有 Ctrl+U 软撤销 Ctrl+T 词互换 Tab缩进 Shift+Tab去除缩进 Ctrl+Shift+UP与上行互换 Ctrl+Shift+DOWN与下行互换 Ctrl+K Backspace 从光标处删除至行首 Ctrl+E
    查看全部
  • 1.ctrl+N:打开编辑区 2.切换语法:ctrl+shift+P:命令模式:sshtml 3.觉得输入的麻烦 可以按atl+.> 匹配出结束标签 4.一个更快捷的方法 “emmet插件” 输入“!”号 →Ctrl+E 5.到包的内部 ctrl+p→#body 匹配到body 这个标签 6.ctrl+enter 在当前下方添加一行 ctrl+shirt+enter 在当前上方添加一行 7.(ul>.item$*10)+(ctrl+E)“ >”号生成子元素 .(class)item(已item开头的class名)$(序号) 8.鼠标拖拽选择ul内的元素 Ctrl+] 增加缩进 [ 减小缩进。 9.alt+f3 全选 移动方向键就有了光标 10.ctrl+e 产生标签 11.ctrl+shift+v 粘贴时保持了缩进
    查看全部
  • Ctrl+H 查找替换 Ctrl+D 多行游标 Ctrl+K 跳过一个文件 Ctrl+Shift+D 复制整行 产生多行游标的四个方法 1. Ctrl+D 2. Alt+F3 Find/Quick Find All 3. Ctrl+A Ctrl+Shift+L Selection/Split into Lines 4. 鼠标拖拽 shift+右键
    查看全部
  • 命令模式:ctrl+shift+P(在新建的文件中可以通过此快捷键来设置文件类型) ctrl + shift + p 快速更改文件类型 ctrl + p 快速查找并打开文件 如:wista/index.html ctrl + p 快速定位并边界 如:@body 可以快速定位到当前文件的body标签 也可以把上面两个操作合二为一 如wista/index.css@body 可以快速打开index.css文件并找到body标签
    查看全部
    5 采集 收起 来源:Goto Anything

    2016-03-04

  • Ctrl+F 查找 Ctrl+D 选择所在词 Ctrl+L 选择行 ctrl+enter ctrl+shift+enter 插入行,插入前行 ctrl+Z 取消 ctrl+Y 恢复 Tab缩进 Shift+Tab去除缩进 Ctrl+/ 注释整行 Ctrl+Shift+/ 注释已选择内容 关闭时会自动保存,下次打开时代码还在
    查看全部
  • ctrl+H:查找替换 ctrl+D:选中内容 ctrl+K-->ctrl+D 跳过选取 ctrl+D-->Atl+F3全选匹配内容 ctrl+shift+D复制当前行 产生多行游标: 1、ctrl+D 2、ctrl+D --> Atl+F3 全选 3、ctrl+A --> ctrl+shift+l 拆分行 4、鼠标放在单词上,按shift+鼠标右键下拉
    查看全部
  • ***********Package Control使用方法********** 1. install Package 安装插件 2. List Package 已经安装插件列表 3. Remove Package 卸载插件 4. Disable/Enable Package 禁用/启用插件 推荐三款主题: 1.theme-soda 2.theme-flatland 3.theme-spacegray 注:主题安装好后,一段使用代码需要copy到user配置中 1、进入官网。(sublime.wbond.net) 2、选择sublime的版本 然后复制下面的代码。 3、进入sublime text 软件,选择view下的show console。 4、将代码粘贴进去按回车等待安装的完成。 5、安装完成后重启sublime text。 6、启用命令模式(ctrl+shift+p),输入package control:install package. 7、等待加载插件,加载完有很多的插件。 8、选择主题插件theme(主题) ****,有很多样式,可以去官网看,推荐flatland、soda、spacegray。。。在命令模式下选择一种,比如选择 theme spacegray。 9、等待安装,安装完成后会弹出使用说明,说明里有叫你把space eighties 下面的复制到自己用户的配置信息中,也就是preferences菜单下的settings user里将复制的代码粘贴进去。(打个逗号粘贴),保存后安装完成,sublime text的主题就会变成安装的主题样式
    查看全部
  • 语法和编写风格的校验插件SublimeLinter 1. SublimeLinter插件是总框架,具体语言再另行安装 2. 具体语言风格例如js, 插件为SublimeLinter_JShint 3. 可以自定义校验风格 Eg. "eqeqeq":true //强制三等号验证 4. 需要安装npm包,安装node.js,再安装JShint,在命令行输入:npm install -g jshint,回车安装; 5. 自定义校验规则:在工程中创建配置文件,名字必须是.jshintrc ,用json语言编写
    查看全部
  • Ctrl+Shift+P:打开命令面板 Ctrl+P:搜索项目中的文件 Ctrl+G:跳转到第几行 Ctrl+W:关闭当前打开文件 Ctrl+Shift+W:关闭所有打开文件 Ctrl+Shift+V:粘贴并格式化 Ctrl+D:选择单词,重复可增加选择下一个相同的单词 Ctrl+L:选择行,重复可依次增加选择下一行 Ctrl+Shift+L:选择多行 Ctrl+Shift+Enter:在当前行前插入新行 Ctrl+X:删除当前行 Ctrl+M:跳转到对应括号 Ctrl+U:软撤销,撤销光标位置 Ctrl+J:选择标签内容 Ctrl+F:查找内容 Ctrl+Shift+F:查找并替换 Ctrl+H:替换 Ctrl+R:前往 method Ctrl+N:新建窗口 Ctrl+K+B:开关侧栏 Ctrl+Shift+M:选中当前括号内容,重复可选着括号本身 Ctrl+F2:设置/删除标记 Ctrl+/:注释当前行 Ctrl+Shift+/:当前位置插入注释 Ctrl+Alt+/:块注释,并Focus到首行,写注释说明用的 Ctrl+Shift+A:选择当前标签前后,修改标签用的 F11:全屏 Shift+F11:全屏免打扰模式,只编辑当前文件 Alt+F3:选择所有相同的词 Alt+.:闭合标签 Alt+Shift+数字:分屏显示 Alt+数字:切换打开第N个文件 Shift+右键拖动:光标多不,用来更改或插入列内容 鼠标的前进后退键可切换Tab文件 按Ctrl,依次点击或选取,可需要编辑的多个位置 按Ctrl+Shift+上下键,可替换行
    查看全部
  • 1. 安装SideBarEnhancements插件 ctrl+shift+p —> Install Package —> 找到SideBarEnhancements SideBarEnhancements 2. 配置预览快捷键 Preferences —> Key Bindings - User 将以下代码复制到数组中。 // chrome { "keys": ["f2"], "command": "side_bar_files_open_with", "args": { "paths": [], "application": "C:/Program Files (x86)/Google/Chrome/Application/chrome.exe", "extensions":".*" } }, // firefox { "keys": ["f3"], "command": "side_bar_files_open_with", "args": { "paths": [], "application": "D:/Program Files (x86)/Mozilla Firefox/firefox.exe", "extensions":".*" } }, // ie { "keys": ["f4"], "command": "side_bar_files_open_with", "args": { "paths": [], "application": "C:/Program Files/Internet Explorer/iexplore.exe", "extensions":".*" } } 上面的代码中有两处需要注意的地方,一个是keys表示快捷键,即f2可以启动chrome进行预览。另一个是application,表示浏览器所在的安装路径,只有路径配置正确,才能够正常调用浏览器
    查看全部
  • 在Javascript语法环境中,Tools->Command Palette… (shift+command+P) 打开命令模式,输入Snippet,选择“Snippet:function"命令可以快速创建函数,通过tab键可以快速切换输入参数和函数体,通过sublime Text自带输入的缩写词也能自动补全代码语句,如输fun 选择提示的fun Function,就会生成函数: function function_name (argument) { // body... }, 输人ife选第一个回车,就会生成: if (true) {} else{} 安装Javascript&NodeJs Snippets 以及jQuery插件, ,很方便的提高生产力,具体指令说明:https://packagecontrol.io/packages/JavaScript%20%26%20NodeJS%20Snippets ,https://packagecontrol.io/packages/jQuery 方便的完成回调函数 安装Insert Callback插件,https://packagecontrol.io/packages/Insert%20Callback 按alt+C就能自动生成回调函数。 《Sublime Text3 snippets》 Snippet Function 1.[ctrl+shift+P]+輸入'pci'+輸入'Snippet: Function' 2.輸入'fun'+[Enter],自動產生 function 3.輸入'ife',自動產生 if else JavaScript snippets 1.[ctrl+shift+P]+輸入'pci'+輸入'JavaScript Completions' 2.輸入'gi',自動產生 getElementById JQuery snippets 1.[ctrl+shift+P]+輸入'pci'+輸入'JQuery' 2.輸入'get',自動產生 get請求 3.輸入'post',自動產生 post請求 Insert Callback 1.[ctrl+shift+P]+輸入'pci'+輸入'Insert Callback' 2.[alt+C],自動產生 callBack function
    查看全部
  • 一些插件及与其相关的快捷键的使用: (1)Emmet插件: 安装Packet:菜单栏View->Show Console->粘贴text2或text3的Packet配置信息->重启软件->Ct+N(新建文档)->Ct+Sh+P->输入pci->查找要安装的插件,如emmet 安装好Emmet插件后: !+Ct+E:迅速生成html的基础元素 Ct+P:查找时加 #元素名;找到后,若要在该行下新加一行,可按 Ct+Enter 在文档中写: ul>.item$*10 ,再按Ct+E,则一次性生成10个<li class="item(1/2/3/../10)"></li> 即 父元素> .(表示有class标签或用 # 表示有id值)类名(id名)$*(子元素出现次数),再Ct+E 在文本中写 h2{this is good} 再按Ct+E,则生成 <h2>this is good</h2> Ct+ 键盘上含 } 的键:文本缩进 Ct+Sh+V:粘贴时保持复制时的格式,如缩进等 (2)insert callback插件 Alt+C:删除多于的符号 (3)advanNew 用于创建文档的同时命名、保存该文档 Ct+Alt+N:在不用打开相关文件夹的情况下新建文档,需填写路径到 文档名.html(或其他类型文档) (4)httpRequester 用于测试地址 Alt+Ct+R:测试 localhost(:端口号)/... (5)netauke Snip (6)sidebar enhancement 右击对应文档,有直接浏览该页的选项 (7)docblockr 用于简化注释拼写 /** +Tab键 :可有函数的注释格式 /** 或 /* + 回车键:其余注释符自动补充 (8)sublimelinter-jshlint 用于语法、风格的检验 安装jsnode插件 -> 安装sublimelinter-jshlint插件 ->运行cmd,输入 npm install -g jshint ->最后到sulimt软件里检验 补充9.html代码对齐插件 html beautiful; 安装后快捷键ctr + alt + shift + f
    查看全部
首页上一页1234567下一页尾页

举报

0/150
提交
取消
课程须知
1.具有前端开发经验; 2.对HTML+CSS+JavaScript内容熟悉掌握。
老师告诉你能学到什么?
1.快速提高编辑水平; 2.增加网络开发专业能力。

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!