WEB 3時間目 - hiro

WEBの授業の3時間目は“マイホームグリーン計画”というホームページを想定したもの。

　あらかじめ用意したテキストデータにhtmlタグを書き込んでいく。練習はしていたものの、素で打つにはまだまだ量が足りないなと実感。GW中にどれだけできるか…これは頑張るしかない。
　下はhtmlタグをいれ、ハイパーリンクをかけたもの。

　次に写真を入れる。

　最後にドキュメントタイプ宣言を入れ、タイトルの色とバックの色を指定する。それが下のものです。

<!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd>
<html lang="ja">
<head>
<meta http-equiv="Content-Type"content="text/html;charset=Shift_JIS">
<meta http-equiv="Content-Style-Type"content="text/css">
<title>マイホーム・グリーン計画</title>
<style type="text/css">
body {
	background: #e0efe0;
}
h1 {
	color: #50bb33;
}
</style>

</head>
<!--ここからbody開始-->
<body>
<h1>マイホーム・グリーン計画</h1>
<p>マイホームで趣味で始めた園芸が，家中を埋め尽くすくらいに大変な状態になってしまいました。</p>
<p>だから本当は「マイホームからちょっとグリーンを減らしたいかも計画」なページかもしれません。</p>
<p><a href="#"><img src="images/01.jpg" alt="" width="300" height="200"></a></p>
<h2>最新の更新情報</h2>
<ul>
<li>ハーブデータベースにパセリを追加しました(5/3)</li>
<li>ハーブ写真集にペパーミントを追加しました(4/30)</li>
</ul>
</p>
<h2>観葉植物の基礎知識</h2>
<p>観葉植物の種類や，育てる環境，コツ，購入値段の話など諸々の雑記です。</p>
<dl>
<dt><a href="#">ハーブ データベース</a></dt>
<dd>コツコツと作ってみました。現在30種類のデータがあります。</dd>
<dt><a href="#">ハーブ写真集</a></dt>
<dd>うちのハーブたちをデジカメで撮ってみました。</dd>
<dt><a href="#">掲示板</a></dt>
<dd>ハーブな話題を熱く語る掲示板です。どうぞ足跡を残していってください。</dd>
</dl>
<address>著作者　e-mail:<a href="mailto:xxx@xxx.com">xxx@xxx.com</a></address>
</body>
<!--ここでbody終了-->
</html>

　そしてブラウザに表示させたもの。

　だんだんと覚えることが増えてきていますが、ひと一つ確実に身につけていかなければ。