管理人より
テンプレートについて
ヘッダーにアイキャッチ用のイメージ画像を表示するタイプです。画像はフェードしながら自動で切り替わるように設定しています。切り替わる時間やフェードの時間などいろいろオプションが変更できます。画像は差し替えてご利用ください。
詳しい使い方は、「jQueryで画像やテキストを自動で切り替える [Cool Web Window]」をご参考ください。
完全幅固定タイプです。
全体的な横幅は760px、メインコンテンツ部分540px、サブコンテンツ部分180pxです。
右側のサブコンテンツ部分はメニューやバナー等を配置することを想定しました。
ヘッダーメニューのサイズがテンプレートの横幅と同じにならないといけないため、メニューの数やメニューひとつ分のサイズによって、テンプレートの幅を調整する必要があります。サンプルでは、メニューひとつ分の横幅を148pxに設定しています。
この度初めて、ページの大見出しというものをつけてみました。このページでは「Welcome to my homepage」がそれにあたります。サイトによっては不要な場合もあるかと思いますが、その際は削除してください。
サブメニューがメインコンテンツより縦の長さがない場合でもきちんと背景色が表示されるように、これまでサブメニュー領域に画像で色を付けていたのですが、逆にメインコンテンツ部分を白色の画像、サブメニューをCSSで簡単に変更できるようにしました。
例えば、テンプレートの横幅を変更する際は、メインコンテンツとサブメニューを囲んでいるdiv要素(#contents)に横幅1000pxの画像を指定しているので、CSSにて、
#contents {
clear:both;
width:740px;
background: #51000c url(../images/bg_contents.gif) -440px 0 repeat-y;
}
ここの、-440pxを、『(-1000px)+(囲んでいるdiv要素の横幅)−(サブメニューの横幅)』の値に変更してください。ややこしくてすみません><
画像について
画像はCoolWebWindow作です。色の変更などの編集も可能です。ご自由にお使いください。
ページ上部への戻りリンクについて
ページ上部への戻りは、JavaScriptを用いて、なめらかにスクロールしながら移動するようにしております。
カスタマイズについて
カスタマイズはご自由になさってください。
制限はありません。
その他、不具合などございましたら
CoolWebWindowにお知らせください。
サンプルタグについて
以下、サンプルタグになります。ご利用の際は参考にしてみてください。
INFORMATION
- 2009-04-28
-
○○新聞に取材を受けました。
- 2009-04-24
-
休業のお知らせ。誠に勝手ながら5月2日から6日まで長期休暇日とさせていただきます。ご了承ください。
タグサンプル
h3タグ
h4タグ
h5タグ
h6タグ
強調(em)
より強い強調(strong)
追加(ins)
削除(del)
テキストアンカー
リスト
普通のリスト
- 普通のリスト1
- 普通のリスト2
- 普通のリスト3
番号付きリスト
- 番号付きリスト1
- 番号付きリスト2
- 番号付きリスト3
li要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。
定義リスト
- 定義リスト1
- 定義した用語の説明
- 定義リスト2
- 定義した用語の説明
- 定義リスト3
- 定義した用語の説明
dd要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。しかし、dt要素にはインライン要素しか記述することができません。