【概要】
リストタグと背景色・背景画像を用いる事によりSEOにも効果的なメニューを作成。
【CSS】
.menu{}
.menu ul{ margin: 0; padding: 0;}
.menu ul li{
list-style : none;
display : block;
width : ○○px;
background-color : #○○;
font-size : ○○px;
}
.menu ul li a{
width : ○○px;
display : block;
color : #○○;
background-color : #○○;
}
.menu ul li a:hover{
width : ○○px;
display : block;
color : #○○;
background-color : #○○;
}
【HTML】
<div class="menu">
<ul>
<li><a href="#" target="_self">リスト1</a></li>
<li><a href="#" target="_self">リスト2</a></li>
<li><a href="#" target="_self">リスト3</a></li>
<li><a href="#" target="_self">リスト4</a></li>
</ul>
</div>
