Archive
CSS Tips 的
- Memo
- 2004-01-30T18:55+09:00
ひとつ前のエントリーで border-style
だけでひとつエントリー書けそう、なんて書いたけれども、いざ向かい合ってみると面倒で書く気にならなかったので割愛。
Tips 的とか書いたので、参考までに何か書いておこうとか思ったりする。
以下のソースでタブっぽいような感じになるかも知れません。
- HTML
- <ul class="menu">
<li><a href="menu1.html">Menu 1</a></li>
<li><a href="menu2.html">Menu 2</a></li>
<li><a href="menu3.html">Menu 3</a></li>
</ul>
これに、
- CSS
- ul {
border-bottom: 1px solid #000;
padding: 0;
} - ul li {
border: 1px solid #000;
border-bottom: none;
display: inline;
margin: 0;
} - ul li a:link, ul li a:visited {
color: #000;
text-decoration: none;
} - ul li a:hover, ul li a:active {
background-color:#333;
color:#ccc;
}
多分これでそれっぽくなるはず。あとは ul に word-spacing
設定するか、li に margin-left
, margin-right
でも入れておけば多分なんとかなるはず。確認してないので適当に数値変えてみたりするといいかも知れない。多分。