サンプルページ

見出しですこの文章はダミーです

見出しH2

段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー段落ダミー

COLORS

.yellow{color:#fff100;}
.pink{color:#e4007f;}
.blue{color:#00a0e9;}
.gray{color:#666666;}
.green{color:#59cf15;}
.dark-blue{color:#004ea2;}
.red{color:#cc0000;}

リストスタイル

  1. 番号リスト
  2. 番号リスト
  3. 番号リスト

テーブル

ヘッダー ヘッダー ヘッダー
セル セル セル

ボタン

ボタン

ボタン

囲み

ダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミー

マージン / パディング

マージン、パディング上下 0px〜100px

class=”mgt0〜100″ // 上マージン
class=”mgb0〜100″ // 下マージン
class=”pdt0〜100″ // 上パディング
class=”pdb0〜100″ // 下パディング

アイコンフォント

https://fontawesome.com/v4.7.0/icons/

疑似クラスで利用の場合の例
.hoge::before{
content: ‘\f2b9’;
font-family: ‘FontAwesome’;
}

インラインでマークアップの場合
<i class=”fa fa-address-book” aria-hidden=”true”></I>

【WEBフォント(Google Fonts)】

デフォルト(本文)は Noto Sans CJK (font-weight 400)

Noto Sans CJK
font-family:noto-sans-cjk-jp, sans-serif;
font-weight: 400 or 500 or 700;

Roboto
font-family: ‘Roboto Condensed’, sans-serif;
font-weight: 700;

Futura
font-family: futura-pt, sans-serif;
font-weight: 500;
font-style: italic;

アコーディオン

アコーディオンメニュー

ダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミーダミー

TOP