【CSS】背景画像の設定

photoshopで背景画像を作成したので、
HTMLで表示してみるソースです。
実践課題【CSS10】の下拵え的に。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>背景画像の練習3【CSS10】の準備</title>
<style type="text/css">
#container {
	width: 670px;
}
#content{
	background-color: #99FF66;
	float:right;
	width: 500px;
}
#side {
  background-image:url(css10/bg_img.gif);
  background-repeat: repeat-y;
  float: left;
  width: 160px;
  height: auto;
  margin-right: 10px;
}
ul {
	list-style-type:none;
}
</style>
</head>

<body>
<div id="container">
<div id="content">
本文ですよ。
</div>
<div id="side">
<ul>
<li>menu01</li>
<li>menu02</li>
</ul>
</div>
</div>
</body>
</html>

作った背景画像は

上記ソースの表示結果画像は『実習課題公開中 | おぼえがき』で公開中。