横並びメニューバーｃｓｓ
http://www.css-designsample.com/csslayout/technique-3.html
これを参考に、いやいやベースにして
つくりやす！
なんだか、色々作って→チェック→駄目だし→作りなおして→チェック→再駄目だし・・・
が
続いていて、
2月末にアップなんて、できんのかいな！
っていう
怒りモードで
だけど、
もう、この仕事飽き飽きモードで
だけど、
納期には間に合わせなくてはいけない
と思いつつ
寝不足が続き、残業が続き、不規則で頭がおかしくなりそ。
あぁ～、遊びたい、休みたい、からだ動かしたい。
3月は休みマクロ。
html とｃｓｓ 丸型タグメニューのソース
tableft4.gif
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Free CSS Navigation Menu Designs 2 at exploding-boy.com</title>
<link rel="stylesheet" type="text/css" href="css/bg_tab1.css" />
</head>
<body>
<div id="tabs4">
<ul>
<li id="current"><a href="inde.html"><span style="width:120px;">サービス概要(必読)</span></a></li>
<li><a href="hikitori.html"><span style="width:70px;">引取修理</span></a></li>
<li><a href="silyuttilyou.html"><span style="width:70px;">出張修理</span></a></li>
<li><a href="mochikomi.html"><span style="width:70px;">持込修理</span></a></li>
<li><a href="tab5.html"><span style="width:70px;">送付修理</span></a></li>
<li><a href="tab6.html"><span style="width:100px;">修理進捗管理</span></a></li>
<li><a href="inqury.html"><span style="width:140px;">電話でのお問い合わせ</span></a></li>
</ul>
</div>
<br clear="all">
</body>
</html>
css
@charset "shift_jis";
/* CSS Document */
/*- Menu Tabs 4--------------------------- */
#tabs4 {
float:left;
width:700px;
font-size:12px;
line-height:normal;
font-weight:bold;
}
#tabs4 ul {
margin:0;
padding:8px 4px 0px 4px;
list-style:none;
float:left;
border-bottom:1px solid #6B78A9;
}
#tabs4 li {
display:inline;
margin:0;
padding:0;
}
#tabs4 a {
float:left;
background:url("../img/tableft4.gif") no-repeat left top;
margin:0;
padding:0 0 0 2px;
text-decoration:none;
}
#tabs4 a span {
float:left;
display:block;
background:url("../img/tabright4.gif") no-repeat right top;
color:#6B78A9;
padding-top: 5px;
padding-right:3px;
padding-bottom:4px;
padding-left: 2px;
text-align:center;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs4 a span {float:none;}
/* End IE5-Mac hack */
#tabs4 a:hover span {
color:#6B78A9;
}
#tabs4 a:hover {
background-position:0% -42px;
}
#tabs4 a:hover span {
background-position:100% -42px;
}
#tabs4 #current a {
background-position:0% -42px;
}
#tabs4 #current a span {
background-position:100% -42px;
}