tabView的实现问题
实现效果图:
我的代码:
1 <style type="text/css">
2 .tab
3 {
4 border: solid 1px #CCC;
5 width: 110px;
6 height: 26px;
7 display: block;
8 float: left;
9 padding-top: 6px;
10 margin-right: 3px;
11 text-align: center;
12 }
13 .content
14 {
15 clear: left;
16 border: solid 1px #ccc;
17 border-top: solid 6px blue;
18 vertical-align: middle;
19 padding-left: 7px;
20 padding-top: 20px;
21 width: 450px;
22 height: 40px;
23 }
24 span:hover
25 {
26 border-bottom-color: Blue;
27 background-color: Blue;
28 color: White;
29 }
30 #one
31 {
32 background-color: Blue;
33 color: White;
34 border: solid 1px #000;
35 border-bottom-color: Blue;
36 }
37 </style>
38 </head>
39 <body>
40 <span class="tab" id="one">Tab One Label</span>
41 <span class="tab" id="two">Tab Two Label</span>
42 <span class="tab" id="three">Tab Three Label</span>
43 <div class="content" id="content">Tab One Content</div>
44 </body>
测试环境 : IE8
问题1:左边线条没对齐。
问题2:mouseover后面的tab时,第一个tab无法变成 白底黑字
其他问题