【ボックス5】
ボックス内の右側に写真を配置することもできます。(写真の幅は128pxまで)
【ボックス1】
タブの切り替えにはJavaScriptを使用しています。JavaScriptが利用できない環境では、全てのボックスの内容がスクロールで表示されることになります。
タブを切り替えると、タブボックスに関する簡単な説明をご覧いただけます。
【ボックス2】
ボックス(本文領域)の高さは11emに設定されています。一番高さのあるボックスに合わせて調整してください。
内容がボックスの高さからはみ出た場合は、スクロールで表示されることになります。(「タブ説明3」を参照)
【ボックス3】
このサンプルでは、タブエリアの幅いっぱいにタブを並べています。タブエリアの幅(468px)を5で割り切れないので、最初と最後の項目にクラス名(first、last)を設定して項目幅を調整しています。(割り切れる場合はこのクラス名の設定は必要ありません)
幅いっぱいに並べない(右側に余白が残る)場合は、CSSコード内の「最後のリンクエリア」の設定を削除してください。(これを削除しないと、最後のタブの右垂直線が表示されません)
また、タブ内のテキストの左右には余裕を持たせてください。ギリギリに設定すると、ブラウザの文字サイズを大きくした際に折り返しが入ってしまいます(表示が崩れてしまいます)。
ブラウザの文字サイズを大きくして表示確認を行ってください。
ページのタイトル、メニュー項目、各セクションのテーマなどは全て仮の内容となります。ご自分のサイトに合わせて内容を変更してください。
このテンプレートに関する説明は、下層ページ内にてご覧いただけます。
色の変更、画像の加工、メニュー項目の変更など、テンプレートの編集をお手伝いいたします。また、テンプレートをベースとしたホームページの制作、メールフォームの設置なども承ります。
※事業者の方向けのサービスとなります。