<!--▼ 縦メニュー ▼-->
<div id="menu_length">
<ul>
<li><a href="<%url>">トップページ</a></li>
<li><a href="<%url>archives.html">サイトマップ</a></li>
<li><a href="<%url>blog-entry-1.html">記事1</a></li>
<li><a href="<%url>blog-entry-2.html">記事2</a></li>
<li><a href="<%url>blog-category-1.html">カテゴリ1</a></li>
<li><a href="<%url>blog-category-2.html">カテゴリ2</a></li>
<li><a href="<%url>blog-category-3.html">カテゴリ3</a></li>
</ul>
</div>
<!--▲ 縦メニュー ▲-->
/* ▼ 縦メニュー ▼ */
#menu_length ul {
margin:0;
padding:0;
}
#menu_length li {
list-style: none;
margin:0;
padding:0;
}
#menu_length li a {
display:block;
text-align:left;
padding-left: 20px;
text-decoration:none;
width:150px; /* 幅 */
line-height:30px; /* 高さ */
color:#ffffff; /* リンク文字の色 */
background-color:#000000; /* メニューボタンの背景 */
border-left:10px solid #c0c0c0; /* 左飾り線 */
border-bottom:1px solid #333333; /* 下線 */
}
/* ▽マウスが乗ったとき▽ */
#menu_length li a:hover{
background-color:#222222; /* メニューボタンの背景 */
border-left:10px solid #ff0000; /* 左飾り線 */
}
/* △マウスが乗ったとき△ */
/* ▲ 縦メニュー ▲ */
≪ 縦メニューの階層化 | HOME | IEで改行タグ<br>を連続しても改行されないバグについて ≫
【共通】
Author:いたお
更新は非常にマイペースです
現在休止中です
なんか、いつになくクールですてきです。
当然、縦メニューがですが…
これから、階層化とか、右にぐりっと出したりしてみます。
ちなみに実験用のブログで…