文字と装飾

<p>上下に余白が付きます。
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

<a>リンク

<strong>重要
<em>強調
class="marker"マーカー
class="label"ラベル

class="right"をつけると、文字が右寄せになります

class="center"をつけると、文字が中央寄せになります

見出し

class="headingL"見出し見出し

class="headingM"見出し見出し

class="headingS"見出し見出し

class="headingSS"見出し見出し

※アルファベットはすべて自動的に大文字になります

日本語だと文字がかなり大きくなりますが、<span class="ja">でくくると文字が小さくなります。

リスト

<ul class="list">

• リスト１
• リスト２
• リスト３

<ol class="list-number">

1. リスト１
2. リスト２
3. リスト３

<dt class="gridlist__label">項目

<dd class="gridlist__text">説明文。Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

<dt class="gridlist__label">項目

<dd class="gridlist__text">説明文。Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

レイアウト

class=“flex”での横並び

文字

画像

class=“grid”での横並び

文字

画像