Firefoxでご覧下さい↓

• ともクリサービス
  
  • Webシステム開発
  • サーバ構築
  • ネットワーク構築

JavascriptやFlashを使ってドロップダウンメニューを
作るのはごく一般的ですが、
上のようにCSSのみでも可能です。

以下ソースです。

■HTML
<ul>
<li id="menuTitle">ともクリサービス
   <ul id="menuList">
   <li><a href="#">Webシステム開発</a></li>
   <li><a href="#">サーバ構築</a></li>
   <li><a href="#">ネットワーク構築</a></li>
   </ul>
</li>
</ul>

■CSS
* {
	margin:0;
	padding:0;
}
li#menuTitle{
	width:150px;
	line-height:30px;
	font-weight:bold;
	border:solid 2px #666;
	text-indent:10pt;
}
ul#menuList {
	list-style:none;
	position:absolute;
	width:0px;
	height:0px;
	overflow:hidden;
	margin-top:2px;
}
li#menuTitle:hover ul#menuList {
	list-style:none;
	width:150px;
	height:auto;
}
a {
	display:block;
	line-height:30px;
	text-decoration:none;
	border-right:solid 1px #666;
	border-bottom:solid 1px #666;
	border-left:solid 1px #666;
	text-indent:10pt;
}

子側のulを通常時width,heightを0で、非表示にしておいて
マウスオーバー時に表示させるという仕組み。

だだし、IEでは6以下のヴァージョンでは
a要素以外の「:hover」疑似クラスが対応していないので
まだ実用的ではないですがIE7が普及した際に
使えるんじゃないでしょうか。