IntelliJ IDEA Tutorial
  • Introduction
  • 01. IntelliJ IDEA 介绍(新用户必看)
  • 02. 教程介绍(新用户必看)
  • 03. 安装环境:Windows
  • 04. 安装环境:Ubuntu
  • 05. 安装环境:Mac
  • 06. 安装环境总结(新用户必看)
  • 07. 首次运行向导(新用户必看)
  • 08. 安装后生成的目录说明、VM 设置(新用户必看)
  • 09. UI 界面(新用户必看)
  • 10. UI 主题、字体、编辑区主题、文件编码修改、乱码问题(新用户必看)
  • 11. 常见各类文件类型图标(新用户必看)
  • 12. IntelliJ IDEA 搜索快的原因:索引(新用户必看)
  • 13. Java 文件编译方式(新用户必看)
  • 14. 项目相关概念(新用户必看)
  • 15. Hello World 的 Java 项目创建和项目配置文件
  • 16. 版本控制讲解(SVN + Git)
  • 17. 实时代码模板
  • 18. 文件代码模板
  • 19. 前端代码模板:Emmet
  • 20. 特殊代码模板:Postfix Completion
  • 21. 插件相关功能
  • 22. Eclipse 的 Java Web 项目环境搭建
  • 23. Maven 结构项目搭建
  • 24. IntelliJ IDEA 配合 Maven 的一些要点
  • 25. Maven 的单模块 / 多模块 Spring MVC + Spring + Mybatis 项目(新人重点)
  • 26. Maven 的单模块 Spring MVC + Spring + Spring Data JPA 项目
  • 27. Maven 的单模块 Spring Boot 项目
  • 28. Debug 技巧
  • 29. 重构技巧
  • 30. 数据库管理工具
  • 31. IntelliJ IDEA 推荐设置(新人重点)
  • 32. IntelliJ IDEA 常用细节 -1
  • 33. IntelliJ IDEA 常用细节 -2
  • 34. IntelliJ IDEA 常用细节 -3
  • 35. IntelliJ IDEA 常用细节 -4
  • 36. IntelliJ IDEA 常用快捷键讲解(Win + Linux)(新用户必看)
  • 37. IntelliJ IDEA 常用快捷键讲解(Mac)(新用户必看)
  • 38. 从 Windows 过度到 Mac 必备快捷键对照表(新用户必看)
  • 39. IntelliJ IDEA 的 Java 热部署插件 JRebel 安装及使用
  • 40. IntelliJ IDEA 远程调试(Tomcat+Jetty)
  • 41. 最特殊的快捷键 Alt + Enter 介绍(新用户必看)
  • 42. IntelliJ IDEA 插件开发视频教程
  • 43. 本教程总结
  • 在机器之间同步 Intellij IDEA 配置
  • IntelliJ IDEA Tips & Tricks: 多个光标
  • IntelliJ IDEA Tips & Tricks: 后缀补全
  • 代码风格设定
  • 在 IntelliJ IDEA 中查看一个类的所有继承类
Powered by GitBook
On this page
  • Emmet 的介绍
  • Emmet 的设置

Was this helpful?

19. 前端代码模板:Emmet

Previous18. 文件代码模板Next20. 特殊代码模板:Postfix Completion

Last updated 5 years ago

Was this helpful?

Emmet 的介绍

Emmet 的前身叫做:Zen Coding,也许熟知旧名的人不在少数。Emmet 一般前端工程师用得比较多,具体它是做什么的,我们通过下面两张 Gif 演示图来说明:

  • IntelliJ IDEA 自带 Emmet 功能,使用的快捷键是 Tab。

Emmet 资料介绍:

Emmet 的设置

  • 如上图标注 1 所示,IntelliJ IDEA 支持主流四个浏览器内核的一些特别 CSS 书写。

  • 如上图标注 2 所示,可以增加或是删除某些属性。

  • 具体使用,如下图 Gif 演示。

  • 如上图标注红圈所示,在 Live Templates 中也有预设三套代码模板。

Emmet 官网:

Emmet 官网文档:

Emmet 速查表:

Emmet 项目主页:

http://emmet.io
http://docs.emmet.io/
http://docs.emmet.io/cheat-sheet/
https://github.com/emmetio/emmet
Emmet 的介绍
Emmet 的介绍
Emmet 的设置
Emmet 的设置
Emmet 的设置