×
关于01. IntelliJ IDEA 介绍(新用户必看)02. 教程介绍(新用户必看)03. 安装环境:Windows04. 安装环境:Ubuntu05. 安装环境:Mac06. 安装环境总结(新用户必看)07. 首次运行向导(新用户必看)08. 安装后生成的目录说明、VM 设置(新用户必看)09. UI 界面(新用户必看)10. UI 主题、字体、编辑区主题、文件编码修改、乱码问题(新用户必看)11. 常见各类文件类型图标(新用户必看)12. IntelliJ IDEA 搜索快的原因:索引(新用户必看)13. Java 文件编译方式(新用户必看)14. 项目相关概念(新用户必看)15. Hello World 的 Java 项目创建和项目配置文件16. 版本控制讲解(SVN + Git)17. 实时代码模板18. 文件代码模板19. 前端代码模板:Emmet20. 特殊代码模板:Postfix Completion21. 插件相关功能22. Eclipse 的 Java Web 项目环境搭建23. Maven 结构项目搭建24. IntelliJ IDEA 配合 Maven 的一些要点25. Maven 的单模块 / 多模块 Spring MVC + Spring + Mybatis 项目(新人重点)26. Maven 的单模块 Spring MVC + Spring + Spring Data JPA 项目

Emmet 的使用


Emmet 的介绍

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

Emmet 的介绍

Emmet 的介绍

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

Emmet 资料介绍:

Emmet 的设置

Emmet 的设置

  • 如上图标注 1 所示,IntelliJ IDEA 支持主流四个浏览器内核的一些特别 CSS 书写。
  • 如上图标注 2 所示,可以增加或是删除某些属性。
  • 具体使用,如下图 Gif 演示。

Emmet 的设置

Emmet 的设置

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

分类导航

关注微信下载离线手册

bootwiki移动版 bootwiki
(群号:472910771)