Help us understand the problem. What is going on with this article?

初心者でも使いこなせる!Emmetのかんたん操作

More than 1 year has passed since last update.

Emmet 基本コマンドについて

Emmetとは?
簡単に説明すると、短いコマンドでコーディングできる魔法のようなツール。

色々ルールはあって覚えるほどコーディングが効率的になりますが、
Emmet初心者で「何から使えばいいかよく分からないよ〜」という方は
下記のコマンドをまず試してみて、使えるようになると良いと思います。

HTML

<table>

HTML
<table>  <tr>
    <th></th>
    <td></td>
  </tr>
  <tr>
    <th></th>
    <td></td>
  </tr>
  <tr>
    <th></th>
    <td></td>
  </tr>
</table>

例えば上記のようなコードを書きたい場合。

table>tr*3>th+td

CSS

line-height: 1.5;

CSS
line-height: 1.5;

この場合の書き方はこう。

lh:1.5

margin-top: 5px;

CSS
margin-top: 5px;

mt:5

border-top: 1px solid #000;

CSS
border-top: 1px solid #000;

bt+

これだけでもかなり楽になります。

これらをマスターしたら次へ進むと良いでしょう。

umeee
プログラミングはエンタテイメントだ! 楽しむことがたいせつ。興味のおもむくままにやりましょう。 VBAから機械学習までなんでも書いてます。
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away