如何安装Sublime Text插件Emmet并解决Tab补全代码问题?

2026-04-18 07:384阅读0评论SEO基础
  • 内容介绍
  • 文章标签
  • 相关推荐

本文共计629个文字,预计阅读时间需要3分钟。

如何安装Sublime Text插件Emmet并解决Tab补全代码问题?

%E2%80%9CEmmet%E6%98%AF%E4%B8%80%E6%AC%BE%E5%BC%80%E5%8F%91%E5%B7%A5%E5%85%B7%EF%BC%8C%E5%9C%A8Sublime%E4%B8%AD%E5%BE%88%E6%9C%89%E7%94%A8%E3%80%82%E5%AE%8C%E5%85%A8%E4%BD%BF%E7%94%A8CSS%E9%80%89%E6%8B%A9%E5%99%A8%E7%9A%84%E8%AF%AD%E6%B3%95%E7%94%9F%E6%88%90%E4%BB%A3%E7%A0%81%EF%BC%8C%E6%98%BE%E8%A6%81%E6%8F%90%E9%AB%98HTML%E5%92%8CCSS%E7%BC%96%E5%86%99%E9%80%9F%E5%BA%A6%E3%80%82%E4%BB%85%E9%9C%80%E6%8C%89%E4%BD%8FTab%E9%94%AE%EF%BC%8C%E5%B0%B1%E5%8F%AF%E4%BB%A5%E5%88%9B%E5%BB%BA%E4%BB%A3%E7%A0%81%E5%9D%97%EF%BC%8C%E6%98%AF%E4%B8%80%E7%A7%AF%E5%88%86%E5%BC%80%E5%A4%B4%E5%86%85%E5%AE%B9%E3%80%82%E2%80%9D

Emmet是一款Web前端开发工具Sublime非常有用的插件,使用仿CSS选择器的语法来生成代码,大大提高了HTML和CSS代码编写的速度。只需按住Tab键即可把一个简写展开成HTML和CSS的代码块,如下图所示,大部分标签都可自动生成。下面由sublime教程栏目给大家介绍一种使用在线安装的方式来安装Emmet插件。

方法步骤:

在安装Emmet插件之前我们首先需要在Sublime Text3上安装Package Control插件管理器,具体操作可参考如下的文章。

按住快捷键Ctrl+Shift+P或者在菜单栏选择Perferences-->Package Control即可打开命令面板,如若没有反应稍等一下便会弹出,界面如下图所示。

如何安装Sublime Text插件Emmet并解决Tab补全代码问题?

打开命令面板找到package control install package,或者在命令面板输入"pcip"即这四个单词的首字母,便会出现新的安装package的面板,搜索emmet找到后点击回车键,稍后便会自动安装。

安装完成后可通过Perferences-->Package Settings-->Emmet查看是否成功,如果Emmet在说明安装成功了。

安装完成后我们利用Emmet插件去快速生成HTML代码,例如输入html:5按住Tab键即可生成HTML文件完整的结构,但是很多人在安装完成后输入html:5然后按住Tab键并没有反应,这是什么原因导致的呢?原来Emmet默认的快捷键是Ctrl+E,我们需要将其设置成常用的Tab键。

在菜单栏选择Preferences-->PackageSettings-->Emmet-->KeyBindings-->User,将以下信息粘贴进去即可。

[{"keys": ["tab"], "args": {"action": "expand_abbreviation"}, "command": "run_emmet_action", "context": [{"key": "emmet_action_enabled.expand_abbreviation"}]}]

重启Sublime Text3此时我们便可以进行代码补全操作了,在新创建的文件上输入html:5,按住Tab键即可看到如下的代码。

注意事项

Emmet插件Tab键不起作用的原因多是因为快捷键冲突导致的,另外需检查是否安装成功。

以上就是详解Sublime插件Emmet的安装及Tab补全代码问题的解决方法的详细内容,更多请关注自由互联其它相关文章!

标签:安装tab

本文共计629个文字,预计阅读时间需要3分钟。

如何安装Sublime Text插件Emmet并解决Tab补全代码问题?

%E2%80%9CEmmet%E6%98%AF%E4%B8%80%E6%AC%BE%E5%BC%80%E5%8F%91%E5%B7%A5%E5%85%B7%EF%BC%8C%E5%9C%A8Sublime%E4%B8%AD%E5%BE%88%E6%9C%89%E7%94%A8%E3%80%82%E5%AE%8C%E5%85%A8%E4%BD%BF%E7%94%A8CSS%E9%80%89%E6%8B%A9%E5%99%A8%E7%9A%84%E8%AF%AD%E6%B3%95%E7%94%9F%E6%88%90%E4%BB%A3%E7%A0%81%EF%BC%8C%E6%98%BE%E8%A6%81%E6%8F%90%E9%AB%98HTML%E5%92%8CCSS%E7%BC%96%E5%86%99%E9%80%9F%E5%BA%A6%E3%80%82%E4%BB%85%E9%9C%80%E6%8C%89%E4%BD%8FTab%E9%94%AE%EF%BC%8C%E5%B0%B1%E5%8F%AF%E4%BB%A5%E5%88%9B%E5%BB%BA%E4%BB%A3%E7%A0%81%E5%9D%97%EF%BC%8C%E6%98%AF%E4%B8%80%E7%A7%AF%E5%88%86%E5%BC%80%E5%A4%B4%E5%86%85%E5%AE%B9%E3%80%82%E2%80%9D

Emmet是一款Web前端开发工具Sublime非常有用的插件,使用仿CSS选择器的语法来生成代码,大大提高了HTML和CSS代码编写的速度。只需按住Tab键即可把一个简写展开成HTML和CSS的代码块,如下图所示,大部分标签都可自动生成。下面由sublime教程栏目给大家介绍一种使用在线安装的方式来安装Emmet插件。

方法步骤:

在安装Emmet插件之前我们首先需要在Sublime Text3上安装Package Control插件管理器,具体操作可参考如下的文章。

按住快捷键Ctrl+Shift+P或者在菜单栏选择Perferences-->Package Control即可打开命令面板,如若没有反应稍等一下便会弹出,界面如下图所示。

如何安装Sublime Text插件Emmet并解决Tab补全代码问题?

打开命令面板找到package control install package,或者在命令面板输入"pcip"即这四个单词的首字母,便会出现新的安装package的面板,搜索emmet找到后点击回车键,稍后便会自动安装。

安装完成后可通过Perferences-->Package Settings-->Emmet查看是否成功,如果Emmet在说明安装成功了。

安装完成后我们利用Emmet插件去快速生成HTML代码,例如输入html:5按住Tab键即可生成HTML文件完整的结构,但是很多人在安装完成后输入html:5然后按住Tab键并没有反应,这是什么原因导致的呢?原来Emmet默认的快捷键是Ctrl+E,我们需要将其设置成常用的Tab键。

在菜单栏选择Preferences-->PackageSettings-->Emmet-->KeyBindings-->User,将以下信息粘贴进去即可。

[{"keys": ["tab"], "args": {"action": "expand_abbreviation"}, "command": "run_emmet_action", "context": [{"key": "emmet_action_enabled.expand_abbreviation"}]}]

重启Sublime Text3此时我们便可以进行代码补全操作了,在新创建的文件上输入html:5,按住Tab键即可看到如下的代码。

注意事项

Emmet插件Tab键不起作用的原因多是因为快捷键冲突导致的,另外需检查是否安装成功。

以上就是详解Sublime插件Emmet的安装及Tab补全代码问题的解决方法的详细内容,更多请关注自由互联其它相关文章!

标签:安装tab