@charset "UTF-8"; /* ========BASIC======== */ html { overflow-y:scroll; } body { margin:0; padding:0; line-height:1.6; letter-spacing:1px; font-family:Verdana, Helvetica, sans-serif; color:#333; font-size:13px; background:#fff; } br { letter-spacing:normal; } a { color:#333; text-decoration:none; } a:hover { color:#008000; text-decoration:none; } img { border:0; } h1,h2,h3,h4,h5,h6 { margin:0; } /* ========TEMPLATE LAYOUT======== */ #top { width:960px; margin:0 auto; background:#fff; border-top:5px solid #008F7C; border-bottom:5px solid #008F7C; } #header { position:relative; width:960px; height:80px; background:#fff; } #menu { width:960px; background:#000; } #contents { clear:both; width:960px; margin-top:10px; } #main { float:left; margin:0 10px; width:580px; } #subL { float:left; width:180px; } #subR { float:left; width:180px; } #footer { position:relative; clear:both; width:960px; } /* 回り込み解除 */ #contents:after { content:""; display:block; height:0; clear:both; visibility:hidden; } /* ========HEADER CUSTOMIZE======== */ #header h1 { margin:0; padding:0 10px; font-size:24px; color:#000; line-height:80px; } #header h1 a { color:#000; } #header h1 a:hover { color:#ddd; } #header .pr { position:absolute; top:10px; right:0; } /* ========MENU CUSTOMIZE======== */ #menu ul { margin:0; padding:0; background:url("../images/bg_menu.gif") 0 50% repeat-x; } #menu li { float:left; color:#333; list-style-type:none; } #menu li a { display:block; margin-right:1px; padding:0 20px; line-height:2.5; color:#fff; } #menu li a:hover{ color:#ddd; } /* 回り込み解除 */ #menu ul:after { content:""; display:block; height:0; clear:both; visibility:hidden; } /* ========MAIN CONTENTS CUSTOMIZE======== */ #main a { color:#008000; } #main a:hover { border:0; color:#008000; border-bottom:1px solid #008000; } #main h2 { margin-bottom:5px; padding:2px 2px 2px 5px; font-size:15px; font-weight:bold; line-height:1.4; border-left:5px solid #000; background:url("../images/bg_h2.gif"); } #main h3 { margin-bottom:5px; font-size:13px; border-bottom:3px double #000; } #main h4 { margin-bottom:2px; padding:3px; font-size:13px; line-height:1.4; background:#ddd; } #main h5 { margin-bottom:2px; font-size:13px; line-height:1.4; border-bottom:2px solid #333; } #main h6 { margin-bottom:2px; font-size:13px; line-height:1.4; } #main p{ margin:0 0 1em 0; line-height:1.4; } #main dd{ padding:0; margin:0 0 1em 1em; padding:3px; background:#f1f1f1; } /* ========subL CONTENTS CUSTOMIZE======== */ #subL .section { background:#DEDDD0; } #subL h2 { padding:3px; font-size:14px; font-weight:bold; color:#fff; background:#49BC1D url("../images/bg_sub_h2.gif") 0 50% repeat-x; } #subL ul { margin:0; padding:5px 0 1em 1em; } #subL li { margin:0; padding-left:18px; line-height:1.8; background:#DEDDD0 url("../images/bg_list.gif") 0 6px no-repeat; list-style:none; } /* ========subR CONTENTS CUSTOMIZE======== */ #subR .pr { margin:10px 0; text-align:center; } #subR h2 { padding:3px; font-size:14px; font-weight:bold; color:#fff; background:#49BC1D url("../images/bg_sub_h2.gif") 0 50% repeat-x; } #subR ul { margin:0; padding:5px 0 1em 1em; } #subR li { margin:0; padding-left:18px; line-height:1.8; background:#DEDDD0 url("../images/bg_list.gif") 0 4px no-repeat; list-style:none; } /* ========PAGETOP CUSTOMIZE========= */ #pageTop { padding:10px; text-align:right; } #pageTop a { padding:0 0 0 12px; background:url("../images/bg_pagetop.gif") 0 60% no-repeat; } /* ========FOOTER CUSTOMIZE======== */ .copyright { padding:20px 0; text-align:center; font-style:normal; font-size:11px; border-top:1px solid #ccc; } 節約・お金大辞典

制作者より

テンプレートについて

ニュートラルなイメージにしてみました。
企業サイトからショッピングサイトまで幅広くご利用いただけるデザインです。

完全幅固定タイプです。
全体的な横幅は960px、メインコンテンツ部分580px、サブコンテンツ部分180pxです。
左側のサブコンテンツ部分はメニューやバナー等を、右側のサブコンテンツ部分は、GoogleAdsense等の広告やバナーを配置することを想定しました。

画像について

画像は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. 番号付きリスト1
  2. 番号付きリスト2
  3. 番号付きリスト3
    li要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。

定義リスト

定義リスト1
定義した用語の説明
定義リスト2
定義した用語の説明
定義リスト3
定義した用語の説明
dd要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。しかし、dt要素にはインライン要素しか記述することができません。

PR

ページのトップへ戻る