前端开发IDE Webstorm使用技巧 2017年1月31日
来源:互联网 发布:阿里云域名代理 编辑:程序博客网 时间:2024/06/06 08:26
- 首先 webstrom是支持Emmet语法 所以肯定有常用的快速生成语法
快速生成的 语法的 主要有以下几点
> 代表下级的元素+ 代表同级元素^ 代表把这个之后的元素往上提高一级* 代表多次生成 重复() 让逻辑更加清晰# 让生成的元素拥有id //比如 div.contanair . 让生成的元素拥有classname //和上者可以一起使用[] 里面为作为自定义的属性 比如 div.classname[data-value]$ 符号可以让我们添加按序的数字 比如 div>li.item$*5就会自动添加12345{} 在大括号之中的为文本 比如div{this txt} lorem 为我们生成无意义的文字 作为文本测试只用 比如 lorem100 生成一百个//在css中同样支持emmet语法 比如输入bt 会生成border-top 输入bt10 生成border-top:10px; 如果想设置多个数字 比如margin 0 auto 那么可以m0auto 更多的语法还要自己探索
- Webstorm小技巧
- f1 可以让我们找到想要的帮助信息 比如你选择了aleart 按下f1就会显示一些相关的帮助
- alt + up/dm 可以帮我们层层递进的选择子元素
- ctrl + shift + v 可以帮我们粘贴 粘贴板中不同的内容
- ctrl + y 快速删除一行
- ctrl + alt + enter 在上方新建一行
- ctrl + shift + enter 在下方新建一行
- ctrl + +/- 折叠或展开代码
- alt + shift + up/dm 上下移动这行代码
- ctrl + e 查看最近的文件
- 选择图片按f1可以快速预览图片
- ctrl + shift + alt + t 重命名复制 支持css 颜色也支持
- f2 在错误里跳转
- alt + enter 可以对错误进行一些推荐操作
- alt + ins 新建文件或目录
- 用meta:vp可以快速生成视口代码
- ctrl+alt+shift+j 选择所有相同的词
- ctrl + w 选择一个单词 比如id class之类的
0 0
- 前端开发IDE Webstorm使用技巧 2017年1月31日
- webstorm前端开发神器使用技巧篇
- 前端编辑器webstorm的使用技巧收藏
- WebStorm:令人眼前一亮的一款前端开发IDE
- webstorm+nodejs+JetBrains IDE Support+chrome打造前端开发神器
- webstorm+nodejs+JetBrains IDE Support+chrome打造前端开发神器
- WebStorm:令人眼前一亮的一款前端开发IDE
- webstorm+nodejs+JetBrains IDE Support+chrome打造前端开发神器
- webstorm+nodejs+JetBrains IDE Support+chrome打造前端开发神器
- webstorm+nodejs+JetBrains IDE Support+chrome打造前端开发神器
- 前端开发利器webStorm配置使用
- 2017年1月29日 iOS开发技巧 - Size Class与iOS 8多屏幕适配(一)
- iOS开发之旅--React native使用IDE推荐webstorm
- 2016年12月16日学习总结----C语言开发的IDE
- 前端面试知识整理-2017年7月10日
- 前端面试题目整理-2017年7月9日
- 前端学习笔记 2017年9月11日
- 开发日志 2017年8月31日
- CentOS7 下Redis的安装以及使用
- C++快速温习笔记(高级)[4]
- 【VS开发】【OpenGL开发】OpenGL---Windows下配置与第一个OpenGL程序
- Java常用类的知识点
- poj 2352 Stars 树状数组
- 前端开发IDE Webstorm使用技巧 2017年1月31日
- 暴露问题是对项目验收最起码的尊重!
- javascript笔记--(第一章)javascript概述
- 1026. 程序运行时间(15)
- 使用DISPATCH_SOURCE_TYPE_DATA_ADD派发源
- 【Java语言程序设计(基础篇)第10版 练习题答案】Practice_9_5
- 振兴中华 蓝桥杯
- 揭开深度增强学习的神秘面纱
- javascript