Typography タイポグラフィ

Typography - サンプル①

ヘッダー1

ヘッダー2

ヘッダー3

ヘッダー4

ヘッダー5
ヘッダー6
<!-- h1 -->
<h1>ヘッダー1</h1>
<!-- h2 -->
<h2>ヘッダー2</h2>
<!-- h3 -->
<h3>ヘッダー3</h3>
<!-- h4 -->
<h4>ヘッダー4</h4>
<!-- h5 -->
<h5>ヘッダー5</h5>
<!-- h6 -->
<h6>ヘッダー6</h6>

Typography - サンプル②

サンプルテキスト　サンプルテキスト　サンプルテキスト
サンプルテキスト　サンプルテキスト　サンプルテキスト

引用元 
<blockquote>
	<p>
		サンプルテキスト　サンプルテキスト　サンプルテキスト<br />
		サンプルテキスト　サンプルテキスト　サンプルテキスト
	</p>
	<cite>
		引用元
	</cite>
</blockquote>

Typography - サンプル③

muted テキスト

info テキスト

success テキスト

warning テキスト

error テキスト 

<!-- muted -->
<p class="text-muted">  muted テキスト  </p>
<!-- info -->
<p class="text-info">   info テキスト   </p>
<!-- success -->
<p class="text-success">success テキスト</p>
<!-- warning -->
<p class="text-warning">warning テキスト</p>
<!-- error -->
<p class="text-error">  error テキスト  </p>

Typography - サンプル④

  • No.01 サンプルアイテム
  • No.02 サンプルアイテム
  • No.03 サンプルアイテム
  • No.04 サンプルアイテム
    • No.04-01 サンプルアイテム
    • No.04-02 サンプルアイテム
    • No.04-03 サンプルアイテム
    • No.04-04 サンプルアイテム
  1. No.01 サンプルアイテム
  2. No.02 サンプルアイテム
  3. No.03 サンプルアイテム
  4. No.04 サンプルアイテム
    • No.04-01 サンプルアイテム
    • No.04-02 サンプルアイテム
    • No.04-03 サンプルアイテム
    • No.04-04 サンプルアイテム
<!-- UL -->
<ul>
	<li>No.01 サンプルアイテム</li>
	<li>No.02 サンプルアイテム</li>
	<li>No.03 サンプルアイテム</li>
	<li>No.04 サンプルアイテム</li>
	<ul>
		<li>No.04-01 サンプルアイテム</li>
		<li>No.04-02 サンプルアイテム</li>
		<li>No.04-03 サンプルアイテム</li>
		<li>No.04-04 サンプルアイテム</li>
	</ul>
</ul>
<!-- OL -->
<ol>
	<li>No.01 サンプルアイテム</li>
	<li>No.02 サンプルアイテム</li>
	<li>No.03 サンプルアイテム</li>
	<li>No.04 サンプルアイテム</li>
	<ul>
		<li>No.04-01 サンプルアイテム</li>
		<li>No.04-02 サンプルアイテム</li>
		<li>No.04-03 サンプルアイテム</li>
		<li>No.04-04 サンプルアイテム</li>
	</ul>
</ol>

Typography - サンプル⑤

No.01 サンプルタイトル
No.01 サンプルデータ
No.02 サンプルタイトル
No.02 サンプルデータ