div#a4内の編集

div#a4内には、画像とパンくずリスト、そしてコンテンツを配置します。

画像は、サイトが緑ベースなので、緑が入ったシンプルな写真がいいと思います。

<div id="a4">
<p id="b2"><img src="gif/32.gif" alt="境界線" /></p>
<p id="b3">>>ホームページ作成講座ＴＯＰ</p>
<h2>画像を並べただけの例</h2>
<p class="b5">略</p>
<h2>画像ビュアーの形にした例</h2>
<p class="b5">略</p>
<h2>z-indexを使った例</h2>
<p class="b5">略</p>

</div>

スタイルは特に難しいところはないので、解説はしません。

h2 {
	font-size:15px;
	color:#494;
	margin:20px 0 10px 20px;
	border-left:solid 10px #272;
	border-bottom:dotted 1px #272;
	width:450px;
	padding-left:5px;
	}
#a4 p#b2 img {
	border-bottom:solid 3px #494;
	}
#a4 p#b3 {
	height:20px;
	background:#8c8;
	font-size:13px;
	line-height:20px;
	padding-left:20px;
	}
#a4 p.b5 {
	font-size:13px;
	margin:5px 0 5px 30px;
	}

ここまでの作成経過はコチラ→サンプル（ホームページ作成講座）

Lesson9～画像ビュアーの作成～

コメントor補足情報orご指摘あればをお願いします。

<< 前のページ
次のページ >>