在鼠标悬停上着色td

时间:2011-02-21 05:42:39

标签: javascript css hover html-table

我希望在td添加背景颜色作为鼠标悬停在smarty中。

我如何使用创建悬停我为悬停创建了一个类,但它不起作用。

帮帮我

4 个答案:

答案 0 :(得分:7)

请参阅css :hover selector

在你的情况下:

td.yourClass { background-color: transparent; }
td.yourClass:hover { background-color: red; /* for example */ }

Live demo

答案 1 :(得分:0)

<SCRIPT language="JavaScript">
function rollbg(chosen, objectID) {
if(chosen == "roll") {
document.getElementById(objectID).className="roll";
}
else {
document.getElementById(objectID).className="over";
}
}
</SCRIPT>




    <STYLE>

.hlink {
display block;
height:20px;
width:75px;
color:black;
background-color:white;
text-align:center;
text-decoration:none;
}
.hlink:hover {
color:white;
background-color:black;
}

    </STYLE>

答案 2 :(得分:0)

你可以尝试这个......

<style>
td.navon {
background-color: #999999;
cursor: hand}
td.navoff {
background-color: #FFFFFF}
</style>

<table>
  <tr>
    <td class="navoff" onmouseover="className='navon'" onmouseoff="className='navoff'">
      td 1
    </td>
  </tr>
  <tr>
    <td class="navoff" onmouseover="className='navon'" onmouseoff="className='navoff'">
      td 2
    </td>
  </tr>
</table>

答案 3 :(得分:0)

你去吧

td{
    background:red;
    color:white;
    padding:10px;
    border:1px solid white;
}

td:hover{
    background:blue;
}

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

检查http://jsfiddle.net/LU9b7/1/

处的工作示例