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

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。在上面的代码中，我假设该页面位于网站的根文件夹中。