XHTML

<div id="globalNavi">

<ul id="nav">
<li><a href="#"><img src="image/top.jpg" alt="TOP" class="btn" width="65" height="21" /></a></li>
<li><a href="#"><img src="image/category.jpg" alt="CATEGORY" class="btn" width="105" height="21" /></a>
    <ul>
        <li><a href="#">sub 2 - 1 </a> </li>
        <li><a href="#">sub 2 - 2 </a>
            <ul>
                <li><a href="#">Sub 2 - 2 - 1</a>
                    <ul>
                    <li><a href="#">Sub 2 - 2 - 1 - 1</a></li>
                    <li><a href="#">Sub 2 - 2 - 1 - 2</a></li>
                    <li><a href="#">Sub 2 - 2 - 1 - 3</a></li>
                    <li><a href="#">Sub 2 - 2 - 1 - 4</a></li>
                    </ul>
                </li>
                <li><a href="#">Sub 2 - 2 - 2</a></li>
                <li><a href="#">Sub 2 - 2 - 3</a>
                    <ul>
                    <li><a href="#">Sub 2 - 2 - 3 - 1</a></li>
                    <li><a href="#">Sub 2 - 2 - 3 - 2</a></li>
                    <li><a href="#">Sub 2 - 2 - 3 - 3</a></li>
                    <li><a href="#">Sub 2 - 2 - 3 - 4</a></li>
                    </ul>
                </li>
			</ul>
		</li>
		<li><a href="#">Sub 2 - 3</a></li>
	</ul>
</li>
<li><a href="#"><img src="image/archive.jpg" alt="ARCHIVE" class="btn" width="95" height="21" /></a>
	<ul>
    	<li><a href="#">2009年6月</a></li>
        <li><a href="#">2009年5月</a></li>
        <li><a href="#">2009年4月</a></li>
        <li><a href="#">2009年3月</a></li>
    </ul>
</li>
<li><a href="#"><img src="image/contact.jpg" alt="CONTACT" class="btn" width="90" height="21" /></a></li>
</ul>

</div>

CSS

ul,li	{ margin:0; padding:0; }
#globalNavi	{ background: url(image/navi.jpg) repeat-x; height: 28px; padding-top: 7px; text-align: center; }

#nav { width: 900px; margin: 0 auto; position: relative; line-height:1; text-align: left; }
#nav li { list-style: none; float: left; position: relative; }

#nav ul { display: none; position: absolute; top: 29px; left: 0; }
* html #nav ul { line-height: 0; }
#nav ul li { float: none; }

#nav ul { width: 120px; }
#nav ul ul { top: 0; left: 121px; }
#nav ul a { 
	display: block;
	width: 108px;
	background:#121212;
	padding: 6px;
	color: #FFF;
	border-bottom: 1px solid #FFF;
	opacity: 0.7;
	filter: alpha(opacity=70);
	zoom: 1;
	line-height: 1;
}
#nav ul a.hover { background: #444; }