更快的工作流程:掌握埃米特,第2部分
更快的工作流程:掌握埃米特,第2部分
- 已被浏览: 730 次2020年10月12日 来源: DMOZ中文网站分类目录
-
在第一部分中,我们了解了埃米特的特点,以及它如何能够使您的工作流程速度更快。在这一部分,
在第一部分中,我们了解了埃米特的特点,以及它如何能够使您的工作流程速度更快。在这一部分,我们将学习如何安装和使用埃米特。
埃米特适用于很多种文本编辑器,但我会用SublimeText,一个非常受欢迎的和功能丰富的文本编辑器。如果你使用其他文本编辑器,请检查http://emmet.io/download/的文档。
埃米特安装在SublimeText
有在SublimeText安装埃米特需要两个步骤。首先,我将安装SublimeText包控制,然后我将安装埃米特插件。
步骤1:安装包控制
随着SublimeText包控制,我们可以很容易地安装新插件。安装SublimeText访问https://sublime.wbond.net/installation后复制代码SublimeText2或SublimeText3 - 无论您使用的版本 - 按<代码> CTRL +`代码>或进入<代码>查看>显示控制台< /代码>。一旦开放,贴上相应的代码为您的版本SublimeText到控制台。当安装完成后,重新启动SublimeText。
步骤2:安装埃米特插件
重新启动SublimeText后,转到<代码>首选项>包控制代码>和类型<代码>安装包代码>。在出现的窗口中,键入/搜索埃米特并选择安装它。当安装完成后,重新启动SublimeText,使更改生效..
入门埃米特
如果你从未使用过埃米特,你知道写作的HTML代码需要时间。假设您创建一个新的HTML文件,你需要一些必要的标签
HTML,头,标题,正文代码>与<代码> HTML5文档类型代码>,如下所示:
<预的tabindex = “0”> <代码> <!DOCTYPE HTML>
<元的charset = “UTF-8”>
文献 TITLE> HEAD>
BODY>
HTML> 代码> PRE>
你可能有一个默认模板开始,或者你保存代码,你只要复制,每一次粘贴代码。如果你这样做,你是在浪费您的宝贵时间。随着艾米特大约需要两三秒钟创建上面的代码。创建一个新文件,并保存它作为html的(例如的index.html)和类型<代码> HTML:5 代码>或<代码> 代码>并按<代码>标签代码>或<!代码> CTRL + E code>的或在文本编辑器的任何其他触发键将该缩写展开,你将有HTML5文档类型和一些必要的标记。
在SublimeText <代码>标签代码>是用于扩展的缩写的关键。让我们先从一些基础知识,后来我们将了解更高级的例子。创建SublimeText一个新的文件,将其保存为emmet.html或index.html。现在键入<代码> HTML:5 码>或<代码> code>,然后按<代码>标签 code>,然后你会为我们的页面基本的HTML代码。
一些有用的HTML快捷键
有HTML和CSS如此多的快捷键,下面是一些最广泛的应用。
1:基本标记与HTML5文档类型
<!预的tabindex = “0”> <代码> 代码>或<代码> HTML:5 代码> PRE>
膨胀到
<预的tabindex = “0”> <代码> <!DOCTYPE HTML>
<元的charset = “UTF-8”>
文献 TITLE> HEAD>
BODY>
HTML> 代码> PRE>
2:脚本源
<预的tabindex = “0”> <代码>脚本:SRC 代码> PRE>
膨胀到
<预的tabindex = “0”> <代码>