無料で使えるホームページテンプレート。ウェブ制作にご利用ください。

無料テンプレート

イメージ500*180

ホームページ作成にご利用ください

このたびはk2-s.comをご利用いただきありがとうございます。 このテンプレートは無料でご利用いただけますが、当サイトへのリンク表示を削除することは出来ません。 また、再配布や、制作業者さま等のご利用は禁止しております。友達や知り合いのサイトを作ってあげる場合も不可です。そのほかご利用に当たっては ダウンロードした中に「はじめにお読みください」というファイルが含まれていますので良くお読みになってご利用ください。

Web素材サイト

sozai-R
0574 W.S.R
素材サーチ「Mateken」
素材NAVI
Web Material Cafe

HTMLの書き方

レイアウトはすべてスタイルシートで行っていますので、指定されたように書けばきちんとできるはずです。 一部制作ソフトを使った場合うまく出来ないようですが、未確認です。基本的にはメモ帳で十分のはずです。

まずページの一番上の白抜きの部分の書き方は、
<div class="t_f">無料で使えるホームページテンプレート〜</div>
という風に書いてください。

その下のサイトのタイトルは、
<h1>無料テンプレート</h1>
というように書きましょう。

メニューの書き方

まずは画像左の3つのメニューの書き方、
<div><a href="リンク先アドレス" class="top_menu">What's New</a></div>
<div><a href="リンク先アドレス" class="top_menu">Pick Up !!</a></div>
<div><a href="リンク先アドレス" class="top_menu">Contact Us</a></div>
ここで注意が必要なのが、メニューの数は3つということです。もし2つとか、4つ5つとしたい場合は、右の画像の高さを60ピクセル×メニューの数にしてください。 当然画像のサイズを変えただけでは画像が伸びたり縮んだりしてしまいますので、お手持ちの画像編集ソフトなどで処理してください。

さてその下のメニューバーですが、
<a href="リンク先アドレス" class="bar">リンクの名前</a> 
というように書いていけばよいですが、</a>の後ろにスペースを空けましょう。でないと見づらいです。

そのほかのHTML

この真上の見出しの書き方は<h2>そのほかのHTML</h2>

ページ中の見出し

このように見出しをつけるときは、<h3>ページ中の見出し</h3>
と書きます。
で、さっきから書いているこの文章は、<p class="r_f1">ここに本文</p>
というようにどんどん書いてください。そのほか本文を以下のように書くといくらかメリハリがつけられます。

<p class="r_f2">ここに本文</p>

<p class="r_f3">ここに本文</p>

<p class="r_f4">ここに本文</p>

<p class="r_f5">ここに本文</p>

また文中のリンクはこんな風に表示されます。リンク

ここにもメニュー

メニュー6
メニュー7
メニュー8

おすすめ情報

ここにおすすめ情報などを書くと良いでしょう。
書き方は、
<p class="l_f1">ここに内容</p>
それと上のメニューの書き方は
<div><a href="#" class="side">メニュー6</a></div>

そのほかの書き方

<p class="l_f2">ここに内容</p>

<p class="l_f3">ここに内容</p>

<p class="l_f4">ここに内容</p>

<p class="l_f5">ここに内容</p>