LoginSignup
10
15

More than 5 years have passed since last update.

EmmetでHTMLタグに好きな属性をつける方法

Last updated at Posted at 2014-08-27

Emmetもしくはzen-codingを使用していて、HTMLに属性をつける方法です。

属性を追加

属性を付与するには[]を内につけたい属性を書きます。

style属性をつける

試しにstyle属性をつけてみましょう。

style属性を追加
td[style="padding: 4%;"]

出力されるHTML

style属性が付与されたタグ
<td style="padding: 4%;"></td>

tdタグにstyle属性が付与されて出力されました。

好きな属性をつける

例えば使用頻度があまりない属性でも特に問題無くつけることができます。

ng-repeat属性を追加
div[ng-repeat="item in items"]

出力されるHTML

ng-repeat属性が付与されたタグ
<div ng-repeat="item in items"></div>

複数属性をつける場合

複数属性を付与したい場合は、[]内で半角スペースで区切ります。

複数属性を追加
div[title="ほげ" ng-repeat="item in items"]

出力されるHTML

複数属性が付与されたタグ
<div title="ほげ" ng-repeat="item in items"></div>

Emmet関連

EmmetでHTMLタグへテキストを挿入する方法
http://qiita.com/pugiemonn/items/a402fc192155878a0de0

10
15
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
10
15