asp.net - 如何在 Gridview 中的 asp:CommandField 悬停时更改背景图像

Question

这是带有背景图像的 CommandField 的代码。

<asp:CommandField DeleteImageUrl="~/cms_images/cancel.gif" ShowDeleteButton="true" ButtonType="Image" />

"~/cms_images/cancel-hover.gif"当用户将鼠标悬停在 CommandField 上时，我想显示此图像。
我该怎么做？

谢谢。

Answer 1

您可以使用 CSS 完成此操作。在页面标记中，您只需要为命令字段声明特定样式 - 本质上这是按钮的 CSS 样式：

<asp:CommandField ShowDeleteButton="true" ButtonType="Button" ControlStyle-CssClass="cancel" />

并在 .css 文件中定义此样式，并定义当用户悬停元素时它如何变化：

.cancel
{
    background-image: url(cms_images/cancel.gif);
}

.cancel:hover
{
    background-image: url(cms_images/cancel-hover.gif);
}

请注意，在 CSS 中，您应该提供相对于页面位置的 URL。在上面的代码中，我假设页面位于网站的根文件夹中。