将 asp.net ImageButton 扩展为 css Sprite

Question

我正在将我的 asp.net 应用程序上的 ImageButtons 更新为扩展 ImageButton 的 WebControl，我将其称为 CSSImageButton。我已经重写了渲染方法，这样我就可以让它们与 css 精灵一起使用。我已经设法使 OnClick 和 OnClientClick 正常工作。但有些按钮有 OnCommand，我不知道该怎么做。

 public class CSSImageButton : ImageButton
{
    public string DivClass { get; set; }


    public CSSImageButton()
    {
        CssClass = "";
    }

    protected override void Render(HtmlTextWriter writer)
    {
        base.Render(writer);
    }

    public override void RenderBeginTag(HtmlTextWriter writer)
    {
        writer.Write("<div class=\"" + CssClass + " " + DivClass + "\">");
    }


    protected override void RenderContents(HtmlTextWriter writer)
    {
        writer.Write("<a id=\"" + this.ClientID + "\" title=\""+ this.ToolTip+"\"");
        if (!String.IsNullOrEmpty(OnClientClick))
        {
            writer.Write(" href=\"javascript:void(0);\" OnClick = \"" + OnClientClick + "\"");
        }
        else
        {
            writer.Write(" href=\"javascript:" + this.Page.GetPostBackEventReference(this, "ButtonClick") + "\"");
        }
        writer.Write("\"></a>");
    }

    public override void RenderEndTag(HtmlTextWriter writer)
    {
        writer.Write("</div>");
    }

}

Answer 1

@roman m：这种方法的问题（取决于您的情况）是，这最终会将 div 嵌套在锚点（“bar”）内，而该锚点将无法通过 HTML 验证。

当然，如果这不是问题，那么您的建议将解决问题，但是从标记/验证的角度来看，艾蒂安的解决方案更加“自然”。

只是我的 $.02

Answer 2

或者，您可以将 ImageButton 替换为 LinkBut​​ton，并在其中包含一个 div 并使用适当的 css-sprites 类

来源

Answer 3

在 ImageButton 的属性 ImageUrl 中，您可以放置​​一个指向透明图像（大小为 1x1 像素，例如：spacer.png）的链接。
然后在 CSS 中放置一个具有宽度和高度的背景图像。

因此，在任何使用 ImageButton 的地方，您都可以调用相同的透明图像（保留在浏览器缓存中）。