Question

我知道这与我的其他问题类似但是我太难理解了所以我已经做了这个

我有两个标签：

“搜索”和“代码”

“搜索”是默认标签，因此我在文本后面的表格中有一个圆角边框但不作为背景

当我将鼠标放在“标签”上时，我希望这个圆形边框位于“标签”标签后面

我该怎么做？

HTML：

<table height="20" width="30" cellpadding="0" cellspacing="0">
<tr>
<td>

<div class="roundedcornr_box_407494">
<div class="roundedcornr_top_407494"><div></div></div>
   <div class="roundedcornr_content_407494">
      <font color="#ffffff" size="2" face="helvetica">
 Search
</font>  
  </div>
<div class="roundedcornr_bottom_407494"><div></div></div>
</div>

</td>
</tr>
</table>

</td>
<td>
<div style="margin-left:10px;" />
<center>
<table height="20" width="30" cellpadding="0" cellspacing="0" >
<tr>
<td>
<center>
<div class="roundedcornr_box_235759">
<div class="roundedcornr_top_235759"><div></div></div>
   <div class="roundedcornr_content_235759"> 
<font color="#585858" size="2" face="helvetica">
 Tags
</font>      </div>
    <div class="roundedcornr_bottom_235759"><div></div></div>
</div>
</center>
</td>
  </tr>
  </table>

CSS：

.roundedcornr_box_407494 {
background: #bdbdbd;
}
.roundedcornr_top_407494 div {
background: url(roundedcornr_407494_tl.png) no-repeat top left;
}
.roundedcornr_top_407494 {
background: url(roundedcornr_407494_tr.png) no-repeat top right;
}
.roundedcornr_bottom_407494 div {
background: url(roundedcornr_407494_bl.png) no-repeat bottom left;
}
.roundedcornr_bottom_407494 {
background: url(roundedcornr_407494_br.png) no-repeat bottom right;
}

.roundedcornr_top_407494 div, .roundedcornr_top_407494, 
.roundedcornr_bottom_407494 div, .roundedcornr_bottom_407494 {
width: 100%;
height: 5px;
font-size: 1px;
 }
.roundedcornr_content_407494 { margin: 0 5px; }

谢谢！

詹姆斯

Answer 1

你可以给你的tab div一个ID，然后当mouseover将它的类改为Seach，然后再将鼠标移出。

您应该尝试将所有样式放在CSS中，因为混合中有中心和字体标记。此外，很多新的浏览器都为css3提供了圆角支持，也许不是你的修复，只是想指出这一点。

更改有关鼠标悬停的表格信息？

1 个答案: