フッターを作成する

さて、実質この節で、作業はお終いです!
あと、一息! ここでは、少し気取って(笑)著作権をアピールしましょう。

HTML:

<div id="copy">
  <p>Copyright &copy; 2009 あなたの名前 All Rights Reserved.</p>
 </div>
※</body>直前に追加です。

CSS:

#copy{
	width: 800px;
	background-color: #669966;
	clear: both;
	text-align: center;
	color: #FFFFFF;
}

CSSで新しいものが二つでてきましたね。

まず、clear: both;ですが、これはカラムで左と右に分けた後に使う命令です。
※正しくは、左右の回り込み処理を解除する、効果があるのですが、特に「カラムで左と右に分けたあとに使う」という解釈で、入門としては問題ないと思います。

また、text-align: center;は、そのままです。テキストを中央に寄せます。

こんな感じに、表示されたら完成です!

©のマークについてですが、このような文字を特殊文字と言います。
このような文字は、見ている人の環境(機種)によって正しく表示されないことがあります。

なので、©と書かずに、

&copy;

と書くと正しく表示されるようになっています。
この特殊文字は他にも色々ありますので、調べてみるとおもしろいですよ^^

「みんなのタグ辞典」というサイトに、特殊文字の一覧が載っています。

みんなのタグ辞典
http://heo.jp/tag/

このサイト、私が初めてウェブサイトを作ったときからあったサイトで、個人的には愛着がかなりあるサイトです^^; いや、一方的な愛着なのですが(笑)

そういった意味でもウェブサイトは面白いですよね。
気がつくと「人と人が繋がっている」というのが、私は好きです^^

・・・と。 さて、これでウェブサイトは完成です!
まだ、これだと、誰も見ることができない状態なので、最後に世界中の人が見られるようにファイルをアップロードをしましょう。
これで、本当に最後です。


関連記事

  1. 今までにやったことを用いて、見出しを装飾する

  2. 入門を終えたあなたがプロ並みのウェブデザインを構築できるあらゆる理由

  3. “page2.html”へリンクする

  4. ページ全体を装飾する

  5. 写真をあれこれ装飾する

  6. 改行をする

お手本ナビの無料HPデザイン

ランダムピックアップ