自动完成HTML结构的快捷键

我正在寻找我应该用来自动完成HTML结构的快捷键。自动完成HTML结构的快捷键

因此，举例来说，当我输入html和按几个键下面的结构应当如下：

<!DOCTYPE html> 
<html> 
    <head> 
    <title> </title> 
    </head> 
    <body> 

    </body> 
</html>

注：我使用的是MAC

来源

2016-06-09 Illep

您是否在寻找模板？ https://manual.macromates.com/en/templates – Midas

@midas模板并没有从TextMate 1继承到2 –

也许你应该考虑你的IDE模板，例如在Sublime Text中，您有snippets，我建议您查看。

但是，您可以使用另一个工作流程使用工具包，如Emmet。 Emmet特别需要的功能称为“Expand Abbreviation”。基本上，您输入“CSS like”字符串，将字尾放在字符串的末尾并点击标签，然后Emmet将其解析为HTML。例如，下面的字符串：

!doctype>html>(head>title)+(body)

将编译以上（与</!doctype>尾结束标记这是一个有点尴尬然而埃米特是相当聪明，我们可以走一步..所以拓展：

html:5

实际上会给你

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Document</title> 
</head> 
<body> 

</body> 
</html>

这几乎是你要找的东西！如果您想更进一步，Emmet还支持扩展!，这是html:5的别名。只有一个字符。

检查出Emmet's cheat sheet更多的一点点。

来源

2016-06-09 17:27:58 bitten

在TextMate中，它们被称为片段，并且可以轻松地为它们分配一个制表符完成快捷方式;

选择Bundles»Edit Bundles ...在TextMate 2菜单中。

选择要添加片段的包，例如， HTML。按Cmd-N创建一个新的捆绑包项目，然后选择Snippet。
选择菜单操作
按Command + N来创建一个新的项目，选择片段。
在文本区域中复制并粘贴您的模板。
在抽屉里有一个“Tab Trigger”字段，在那里输入“html”。

保存。

现在，当您键入“html”并按Tab键时，您的代码段将被插入。

More info about creating a snippet.

注：我已经在你身上的标签之间添加 “$ 0”。这是一个制表位，您的光标将显示在$ 0处。你可以阅读更多关于advanced Snippet features here。

In My Humble Opinion;

html没有选项卡已完成，因为没有好的方法来预测你想要在你的html模板中。

当然，艾米特（@bitten在他的回答中提供）给你东西，但是html:5确实太多了; HTML5并未强制要求html，head或body标记。见this Stack post about HTML5's optional tags。请参阅被咬的评论为这个方法的一些保证的关心。

也就是说，我使用Emmet，这是值得研究的。

至于只需在TextMate中插入HTML5的doctype，只需键入doctype和Tab。

来源

2016-06-09 18:42:36

关于省略'head'和'body'标记，这是一个有趣的点。一方面它是有道理的，虽然你冒着破坏与旧版IE的兼容性的风险。另一个问题是与当前脚本不兼容，许多异步加载脚本和库使用这些标记来追加他们的'脚本'到一些浏览器不会自动填充DOM（就像我们知道的最流行的浏览器一样）。如果您确定与您的项目兼容，我会推荐它。 – bitten

自动完成HTML结构的快捷键

回答

相关问题