タグ

既定では、行の頭（または空白の後ろのみ）のテキストは HTML タグを表します。インデントされたタグは入れ子になっていて、HTML のツリー構造を作成します。

xxxxxxxxxx

ul

  li Item A

  li Item B

  li Item C

xxxxxxxxxx

<ul>

  <li>Item A</li>

  <li>Item B</li>

  <li>Item C</li>

</ul>

Pug はどの要素が自己完結しているかも認識しています。

xxxxxxxxxx

img

xxxxxxxxxx

<img />

ブロック展開 ¶

スペースを節約するために、Pug は入れ子になったタグのインライン構文を提供します。

xxxxxxxxxx

a: img

xxxxxxxxxx

<a><img /></a>

自己完結タグ ¶

img、meta、link などのタグは、（XML ドキュメントタイプを使用しない限り）自動的に自己完結している。

また、/ 文字を追加することで、タグを明示的に自己完結させます。何をしているのかわかっている場合にのみ、これを行ってください。

xxxxxxxxxx

foo/

foo(bar='baz')/

xxxxxxxxxx

<foo />

<foo bar="baz" />

レンダリングされた空白 ¶

空白はタグの最初と最後から削除されるので、レンダリングされた HTML 要素が接するかどうかの制御ができます。空白の制御は一般的に プレーンテキスト を介して処理されます。