# Emmet

> For the complete documentation index, see [llms.txt](https://www.jetbrains.com/zh-cn/help/idea/llms.txt).

> **TL;DR**
> `文件 | 设置 | 编辑器 | Emmet`  适用于 Windows 和 Linux
>
>
>
> `%instance% | 设置 | 编辑器 | Emmet`  适用于 macOS
>
>
>
> `Ctrl+Alt+S` (Windows), `⌘ Comma` (macOS), `⌘ Comma` (IntelliJ IDEA Classic (macOS)), `⌘ Comma` (macOS System Shortcuts), `Ctrl+Alt+S` (XWin), `Ctrl+Alt+S` (GNOME), `Ctrl+Alt+S` (KDE), `Ctrl+Alt+S` (Emacs), `Ctrl+Alt+S` (Sublime Text), `⌘ Comma` (Sublime Text (macOS)), `Ctrl+Alt+S` (Visual Studio), `⌘ Comma` (Visual Studio (macOS)), `Ctrl+Alt+S` (NetBeans), `Ctrl+Alt+S` (Eclipse), `⌘ Comma` (Eclipse (macOS)) !["设置"图标](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.settings.svg)

在本页配置 [Emmet](using-zen-coding-support.html) 偏好设置以用于 HTML、XML、JavaScript (JSX Harmony) 文件和样式表。

> **Note:**
> IntelliJ IDEA 仅在输出不超过 15 KB 时扩展缩写。

|  条目  |  描述  |
| --- | --- |
|  使用以下键展开缩写  |  在此列表中，选择用于展开 Emmet 选择器的默认键。 此键还将扩展 [Emmet 实时模板](https://github.com/emmetio/emmet)。  |

## Emmet.HTML

|  条目  |  描述  |
| --- | --- |
|  启用 XML/HTML Emmet  |  选中此复选框以启用对 XML 和 HTML 的 Emmet 支持。 如果不选中此复选框，则复杂的缩写（例如  `div.class>ul#list>.item$)`  以及类似缩写）将无法在编辑器中运行。  |
|  启用缩写预览  |     选中此复选框，IntelliJ IDEA 将显示一个弹出窗口，预览输入的缩写内容，然后再实际展开。      ![缩写预览](https://resources.jetbrains.com/help/img/idea/2026.3/emmet_abbreviation_preview.png)  |
|  在使用 <a> 标签包裹文本时启用 URL 自动识别  |      * 如果此复选框被清除，并且您用 `Ctrl+Alt+J` (Windows), `⌘ ⌥ J` (macOS), `⌘ ⌥ J` (IntelliJ IDEA Classic (macOS)), `⌘ ⌥ J` (macOS System Shortcuts), `Ctrl+Alt+J` (XWin), `Ctrl+Alt+J` (GNOME), `Ctrl+Alt+J` (KDE), `Ctrl+Alt+J` (Emacs), `Ctrl+Alt+J` (Sublime Text), `⌘ ⌥ J` (Sublime Text (macOS)), `Ctrl+E, U` (Visual Studio), `⌘ E, U` (Visual Studio (macOS)), `Ctrl+Alt+J` (NetBeans), `Ctrl+Alt+J` (Eclipse), `⌘ ⌥ J` (Eclipse (macOS)) 包装一个 URL 地址，并带有 `<a>` 标签，IntelliJ IDEA 将 URL 地址括在 `<a href=""></a>` 中，并将插入点放在 `href` 属性的双引号内。 例如，包裹 `https://www.jetbrains.com/zh-cn` 将产生如下结果： `<a href="` \| `">https://www.jetbrains.com/zh-cn</a>`    * 如果选中此复选框，并且您将 ( `Ctrl+Alt+J` (Windows), `⌘ ⌥ J` (macOS), `⌘ ⌥ J` (IntelliJ IDEA Classic (macOS)), `⌘ ⌥ J` (macOS System Shortcuts), `Ctrl+Alt+J` (XWin), `Ctrl+Alt+J` (GNOME), `Ctrl+Alt+J` (KDE), `Ctrl+Alt+J` (Emacs), `Ctrl+Alt+J` (Sublime Text), `⌘ ⌥ J` (Sublime Text (macOS)), `Ctrl+E, U` (Visual Studio), `⌘ E, U` (Visual Studio (macOS)), `Ctrl+Alt+J` (NetBeans), `Ctrl+Alt+J` (Eclipse), `⌘ ⌥ J` (Eclipse (macOS))) URL 地址与 `<a>` 标签一起使用，IntelliJ IDEA 会将 URL 地址作为 `href` 属性的值插入双引号中，并将 URL 包含在 `<a href="<wrapped URL>"></a>` 中。 例如，包裹 `https://www.jetbrains.com/zh-cn` 将产生如下结果： `<a href="https://www.jetbrains.com/zh-cn">https://www.jetbrains.com/zh-cn</a>`    |
|  在模板末尾添加编辑点  |      * 如果选择此复选框，编辑位置将添加到 HTML 模板的末尾 ($END$)。    * 如果未选中此复选框，则不会添加新的编辑点。 关闭添加编辑点: ![未添加额外编辑点](https://resources.jetbrains.com/help/img/idea/2026.3/emmet_cursor_position_off.png) 开启添加编辑点: ![已添加额外编辑点](https://resources.jetbrains.com/help/img/idea/2026.3/emmet_cursor_position.png)    |
|  BEM  |     在此区域，为类名、修饰符和简写元素指定 BEM 分隔符。 欲了解更多信息，请参阅 [Emmet 文档](https://docs.emmet.io/filters/bem/)。     |
|  默认启用的过滤器  |     在此区域，指定要在显示到编辑器之前应用于已展开缩写的  Emmet 过滤器 。 详细了解有关筛选器的更多信息，请访问 [https://docs.emmet.io/filters/](https://docs.emmet.io/filters/)。 要默认始终应用筛选器，请选中其旁边的复选框。 可用选项包括：        * [XSL 调优](https://docs.emmet.io/filters/#xsl-tuning-xsl)    * [注释标签](https://docs.emmet.io/filters/#comment-tags-c)    * [退出](https://docs.emmet.io/filters/#escape-e)    * [单行](https://docs.emmet.io/filters/#single-line-s)    * [BEM](https://docs.emmet.io/filters/bem/)    * [修剪行标记](https://docs.emmet.io/filters/#trim-line-markers-t)    |

## Emmet.CSS

|  条目  |  描述  |
| --- | --- |
|  启用 CSS Emmet  |  选中此复选框以启用对样式表的 Emmet 支持。 如果未选中此复选框，那么像  `bdci:n`  展开为  `border-corner-image: none;`  这样复杂的缩写将在编辑器中无法使用。  |
|  启用 CSS 缩写的模糊搜索  |  选中此复选框后，每个未知缩写都会根据可用的模板名称进行评分。 将使用得分最高的匹配项来解析模板。 例如，启用此选项后，以下缩写可以等于：     * `ov:h`    * `ov-h`    * `o-h`    * `oh`    |
|  启用未知属性的扩展（'unknown' 到 'unknown:;'）  |      * 选中此复选框时，任何输入的词都会扩展为相同的词，后跟冒号和分号；    * 当此复选框被清除时，只有已知属性（例如， `color` ）会以这种方式展开 `颜色：;`    |
|  自动插入 CSS 浏览器前缀  |  选中此复选框后，下表中列出的 CSS 属性将展开为包含前置厂商前缀的结构。 了解更多信息，请访问 [Vendor prefixes](https://docs.emmet.io/css-abbreviations/vendor-prefixes/)。    如果未选中此复选框，则整个属性表将被禁用。     |
|  属性和供应商前缀  |  该表包含与各浏览器对应的 CSS 属性和厂商前缀列表。     * 若要在浏览器中启用或禁用属性，请选中或清除浏览器列下的复选框。    * 要向列表中添加新属性，请点击 添加 按钮 ![](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.add.svg)或按 `Alt+Insert` (Windows), `⌘ N` (macOS), `⌃ N` (IntelliJ IDEA Classic (macOS)), `⌘ N` (macOS System Shortcuts), `Alt+Insert` (XWin), `Alt+Insert` (GNOME), `Alt+Insert` (KDE), `Alt+Insert` (Emacs), `Alt+Insert` (Sublime Text), `⌘ N` (Sublime Text (macOS)), `Alt+Insert` (Visual Studio), `⌘ ⌃ N` (Visual Studio (macOS)), `Alt+Insert` (NetBeans), `Alt+Insert` (Eclipse), `⌘ N` (Eclipse (macOS))。 然后在打开的对话框中输入该属性的名称，并在相关浏览器中启用它。    * 要从列表中删除一个或多个属性，请选择它们并点击 移除 ![](https://resources.jetbrains.com/help/img/idea/2026.3/app.expui.general.remove.svg)或按 `Alt+Delete` (Windows), `⌘ ⌦` (macOS), `⌘ ⌦` (IntelliJ IDEA Classic (macOS)), `⌘ ⌦` (macOS System Shortcuts), `Alt+Delete` (XWin), `Alt+Delete` (GNOME), `Alt+Delete` (KDE), `Alt+Delete` (Emacs), `Alt+Delete` (Sublime Text), `⌘ ⌦` (Sublime Text (macOS)), `Ctrl+R, D` (Visual Studio), `⌘ R, D` (Visual Studio (macOS)), `Alt+Delete` (NetBeans), `Alt+Delete` (Eclipse), `Alt+Delete` (Eclipse (macOS))。    |

## Emmet.JSX

|  条目  |  描述  |
| --- | --- |
|  启用 JSX Emmet  |  选中此复选框以在 [JSX Harmony](https://facebook.github.io/jsx/)上下文中的 XML 片段中使用 Emmet。  |

## See also

### 过程

[Emmet](using-zen-coding-support.html) [实时模板](settings-live-templates.html)

### 外部链接

[Emmet documentation](https://docs.emmet.io/) [BEM filters](https://docs.emmet.io/filters/bem/)