h2 見出し class="type-gray" h2
当サイト『EasyBuild イージービルド』とほぼ共通のレスポンシブwebデザインテンプレートです。
横幅は960px、ボックス、見出し、メニュー、すべてシンプル。
スクリーン幅が1020px以下になるとフロートを解除して1カラム表示に切り替えます。
本ウィンドウの幅を変えていただきますと、レスポンシブに表示が切り替わる様子を確認できます。
グレーを基調に地味な配色です。
ここにカラーの画像やテキストなどが入ると映えます。
各要素のカラーを変更して、画像でイメージを広げていただければポップにもクールにも仕上がると思います。
※注釈用 class="font-small"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-gray" h2
h3 見出し class="type-gray" h3
h3 見出し class="type-blue" h3
h3 見出し class="type-pink" h3
このボックスの背景は白 id="right-box-590-content"サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
※注釈用 class="font-small"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-gray" h2
このボックスの背景は白 id="right-box-590-content"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
※注釈用 class="font-small"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-gray" h2
枠なしボックス id="right-box-590-content-clear"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-blue" h2
枠なしボックス id="right-box-590-content-clear"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-pink" h2
枠なしボックス id="right-box-590-content-clear"
以下、BOX組み合わせ いろいろ
h2 見出し class="type-blue" h2
このボックスの背景はグレー id="right-box-590-content-gray"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-blue" h2
このボックスの背景はグレー id="right-box-590-content-gray"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-blue" h2
このボックスの背景はグレー id="right-box-590-content-gray"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-pink" h2
このボックスの背景はブルー id="right-box-590-content-blue"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-pink" h2
このボックスの背景はブルー id="right-box-590-content-blue"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-pink" h2
このボックスの背景はブルー id="right-box-590-content-blue"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-gray" h2
このボックスの背景はピンク id="right-box-590-content-pink"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-blue" h2
このボックスの背景はピンク id="right-box-590-content-pink"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し class="type-pink" h2
このボックスの背景はピンク id="right-box-590-content-pink"
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し h2
h3 見出し h3
h3 見出し h3
h3 見出し h3
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
※注釈用 class="font-small"
サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し h2
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
※注釈用 class="font-small"
サンプルテキスト、サンプルテキスト、サンプルテキスト
h2 見出し h2
サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト、サンプルテキスト
※注釈用 class="font-small"
サンプルテキスト、サンプルテキスト、サンプルテキスト