css th:hover to change background - color
i have table with below structure:
<table class="cedvel">
<caption>
count:
<%:Html.Encode(TempData["RowsCount"])%></caption>
<thead>
<tr>
<th id="thAfield1" class="field1,asc">
<span>field1</span><span id="spanAfield1" class="spanAscDesc">↑↓</span>
</th>
<th id="thfild2" class="field2,asc">
<span>field2</span> <span id="spanfield2" class="spanAscDesc">↑↓</span>
</th>
................................
</thead>
<tbody>
<%if (Model.<----->.Count() > 0)
{
foreach (var abonent in Model.<---->)
{%>
<tr>
<td>
data
开发者_如何学Python </td>
<td>
data
</td>
................................
</tr>
<tr class="noData">
<td colspan="11">
no info
</td>
</tr>
<% }%>
</tbody>
</table>
now i want to change background - color when hovering on th. but can not do it. but simply i can change color when hovering on tr. but on th i can not.
table.cedvel th
{
background-color: #c3dde0;
background-image: url(../Content/SiteImages/1.png);
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
}
table.cedvel th:hover
{
background-color: Red;
}
i simply setting background-image: none when hovering. here was my problem. when i hovered on it. it changed background color. but my pic. hided it.
Have a look at this fiddle : http://jsfiddle.net/jomanlk/Bcayc/ It works form e
You probably have an issue with your CSS.
table.cedvel th {
background-color: #c3dde0;
background-image: url(../Content/SiteImages/1.png);
}
table.cedvel th:hover {
background-color: red;
background-image: none;
}
精彩评论