サブページ
h1サンプルh1サンプル
サンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプル
h2サンプルh2サンプル
h3サンプルh3サンプル
h4サンプルh4サンプル
h5サンプルh5サンプル
装飾・レイアウト
文字装飾・リンク
普通の文字、マーカーつき太字、マーカーなし太字、赤字、大きい文字、小さい文字
太字の赤字など、上記クラスを組み合わせても使えます。
シンプルなボタン(小) シンプルなボタン(大)リスト
- 点のリスト(class=”list_dot”)
- 点のリスト
- 点のリスト
- 点のリスト
- 点のリスト
- 数字リスト(class=”list_number”)
- 数字リスト
- 数字リスト
- 数字リスト
- 数字リスト
- チェックリスト(class=”list_check”)
- チェックリスト
- チェックリスト
- チェックリスト
- チェックリスト
- ワンポイントリスト(class=”list_point”)
- ワンポイントリスト
- ワンポイントリスト
- ワンポイントリスト
- ワンポイントリスト
テーブル
※レスポンシブサイトでは横3つ以上セルを作らないで下さい
サンプル | |
---|---|
色つきのセル | プレーン |
センター寄せ | |
右寄せ(値段表記は全て右寄せ) |
ボックス
ボーダーボックスサンプル
ボーダーボックスボーダーボックスボーダーボックス
画像・コンテンツ配置
デフォルト画像配置
画像の配置はPC、タブレット→原寸位置指定なし、スマホは100%センターになっています。
このデフォルトの設定を変えて配置する場合は以下を参照してください
画像のセンター寄せ
サンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプル
画像の右寄せ(float使用のためclearもしくはclearfixを忘れずに)
サンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプル
画像の左寄せ(float使用のためclearもしくはclearfixを忘れずに)
サンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプル
複数画像横並びレイアウト(PC、タブレットのみ適用)
中身のクラス名(wrap_contents)は必要があれば自由に変えてください。
※変える場合は、%でもpxでも必ず横幅指定をしてください。
真ん中寄せ、オーバーしたサイズは下へ
左右端固定し残りは等分布、オーバーしたサイズは下へ
レスポンシブ対応
PCだけで消す、タブレットだけで消す、スマホだけで消す(文字・画像共通)
このPは普通のテキストです
●このPはPCだけ消します
▲このPはタブレットだけ消します
■このPはスマホだけ消します。
このPは上記を応用して
スマホだけ途中で改行されます。
スマホでの画像リサイズなし
元画像の横幅が320px以下だった場合はスマホで100%にリサイズせず、原寸で掲載した方が見栄えが良い場合があります。その場合はno_resizeタグを使ってください。