1109|webデザイン求職者支援受講記録|#32

webクリエイター訓練

時間割

画像置換

メイン写真周りをドロップシャドウでかざりました。
朝方作ったのはボーダー指定で課題の趣旨がちがってました。

<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ソファーのあるインテリア</title>
<style type="text/css">
<!--
*{
	margin:0;
	padding:0;
}
mig {
	border: none;
}
#container{
	width:850px;
	margin:0 auto;
	text-align:center;
}

p.main{
	background-color:#FFF;
	background-image:url(images/bg.jpg);	
	background-repeat:no-repeat;
	background-position:center center;
	width:780px;
	height:463px;
	margin:0 auto;
}


p.main img{
	margin-top:15px;
}
p.thumbnail{
	margin:10px 0 0 5px;
}
p.thumbnail img{
	margin:0 7px 0 0;
}


-->
</style>
</head>

<body>
<div id="container">

<p class="thumbnail">
<img src="images/ssofa01.jpg" width="144" height="144" onMouseOver="document.bigimg.src='images/sofa01.jpg'">

<img src="images/ssofa02.jpg" width="144" height="144" onMouseOver="document.bigimg.src='images/sofa02.jpg'">

<img src="images/ssofa03.jpg" width="144" height="144" onMouseOver="document.bigimg.src='images/sofa03.jpg'">

<img src="images/ssofa04.jpg" width="144" height="144" onMouseOver="document.bigimg.src='images/sofa04.jpg'">

<img src="images/ssofa05.jpg" width="144" height="144" onMouseOver="document.bigimg.src='images/sofa05.jpg'">
</p>



<p class="main"><img src="images/sofa01.jpg" width="750" height="433" name="bigimg"></P>

</div>


</body>
</html>