ナビゲーションバーの例

ＨＴＭＬに追加する部分
（aaa,bbbは任意の文字）

<div id="aaa">
<div id="bbb">
<ul>
<li><a href="かてごり１のＵＲＬ">かてごり１</a></li>  
<li><a href="かてごり２のＵＲＬ">かてごり２</a></li>  
<li><a href="かてごり３のＵＲＬ">かてごり３</a></li>
<li><a href="かてごり４のＵＲＬ">かてごり４</a></li>
<li><a href="かてごり５のＵＲＬ">かてごり５</a></li>
<li><a href="かてごり６のＵＲＬ">かてごり６</a></li>
</ul>                       
</div>
</div>


スタイルシートに記入する部分
（aaa,bbbは任意の文字）

#aaa {
font-size:12px;
height:35px;
font-weight:normal;
background-color:#EEEEEE;
border-bottom: 1px solid #ccc;
font-family: verdana;
}

#bbb {
position: relative;
}

#aaa ul {
margin: 0;
padding: 0 0 0 20px;
ist-style: none;
}

#aaa ul li {
float: left;
padding-top: 2px;
}

#aaa ul li a {
font-weight:normal;
border-left: 1px solid #c2beba;
display: block;
text-decoration: none;
padding: 7px 15px 7px 16px;
background-color: #ebe9e8;
}

#aaa ul li a:hover {
text-decoration: underline;
}