30DAYSトライアル VScode お勉強 ツール

【デイトラ】Bootstrap学習 Emmet利用【30DAYSトライアル DAY12】

30DAYSトライアル

Emmetが標準で使えるエディタ「VS Code」で実際にEmmetを利用してコードを書いてみましたがめちゃくちゃ便利!これは使わないと損です!

HTMLは使いたいタグと「>」「+」「*」の記号の組み合わせで大体なんとかなる模様。
CSSもEmmet可能でプロパティの頭文字に数値や記号を付ければOK!

あと、「div.test」のように「要素名.クラス名」でエンター押すと、中のクラス名まで入力されたタグが完成されるのですごく便利!

<div class="test"></div>

参考サイト

上記の参考サイトを見ていて、その中で出てきた「dlタグ」「dtタグ」「ddタグ」というタグがどういうものか分からず、ちょっと調べてみました。

dl・dt・ddタグで説明リストを作る

<dl>
 	<dt>説明したい言葉</dt>
 	<dd>説明文</dd>
</dl>

ちなみにdlリストを定義リストとして辞書的な扱いをすたう場合は、「dfnタグ」で定義したい言葉を囲み、dlリストが定義リストであることを示します。

<dl>
  <dt><dfn>定義したい言葉</dfn></dt>
  <dd>定義文</dd>
</dl>

上記のように、dlリストは説明リストとして使う場合と定義リストとして使う場合の2種類があります。

ulリストとdlリストの違い

  • ulリストは単純に項目名を並べたいとき
  • dlリストは項目ごとに説明文を加えたいとき

各種リンク先

-30DAYSトライアル, VScode, お勉強, ツール
-,

© 2021 文系女子とプログラミング