我有一个图像按钮。我想在上面添加一个文本“搜索”。但是由于VS 2008中的“imagebutton”属性没有文本控件，所以我无法添加它。有人能告诉我如何将文本添加到图像按钮吗？
<asp:ImageButton ID="Searchbutton" runat="server" AlternateText="Search"
CssClass="bluebutton"
ImageUrl="../Graphics/bluebutton.gif" Width="110px"
onclick="Searchbutton_Click"/>
<button runat="server"
style="background-image:url('/Content/Img/stackoverflow-logo-250.png')" >
your text here<br/>and some more<br/><br/> and some more ....
</button>
<asp:LinkButton
CssClass="lnkSubmit"
ID="lnkButton"
runat="server">SUBMIT</asp:LinkButton>
a.lnkSubmit:active
{
margin:0px 0px 0px 0px;
background:url(../../images/li_bg1.jpg) left center no-repeat;
padding: 0em 1.2em;
font: 8pt "tahoma";
color: #336699;
text-decoration: none;
font-weight: normal;
letter-spacing: 0px;
}
使用ImageButton无法实现该效果。
不过，您可以使用简单的Button，设置文本，并使用CSS添加背景图像（bluebutton.gif）来实现所需效果。
无法在图像按钮内添加文本。我也遇到了同样的问题。我的解决方案是使用链接按钮而不是图像按钮。只需在样式标签中添加图像即可。
我意识到这是一个旧帖子，但最近我已经为自己解决了相同的问题。
我创建了一个ImgButton服务器控件来呈现这个：
<button> <img src="button_icon.png" /> Caption Text </button>
使用CSS来为背景图片添加样式有一些缺点，主要包括：
我将尝试在此处插入代码，但也可以在这里找到完整的源代码和示例： 带有Img标签和标题文本的按钮
ImgButton.cs:
[DefaultProperty("Text")]
[DefaultEvent("Click")]
[ToolboxData("<{0}:ImgButton runat=server></{0}:ImgButton>")]
public class ImgButton : WebControl, IPostBackEventHandler
{
#region Public Properties
public enum ImgButtonStyle
{
Button,
Anchor
}
[Bindable(true)]
[Category("Appearance")]
[DefaultValue("")]
[Localizable(true)]
public string Text
{
get
{
String s = (String)ViewState["Text"];
return ((s == null) ? String.Empty : s);
}
set
{
ViewState["Text"] = value;
}
}
[EditorAttribute(typeof(System.Web.UI.Design.ImageUrlEditor), typeof(UITypeEditor))]
public string ImgSrc { get; set; }
public string CommandName { get; set; }
public string CommandArgument { get; set; }
[EditorAttribute(typeof(System.Web.UI.Design.UrlEditor), typeof(UITypeEditor))]
public string NavigateUrl { get; set; }
public string OnClientClick { get; set; }
public ImgButtonStyle RenderStyle { get; set; }
[DefaultValue(true)]
public bool UseSubmitBehavior { get; set; }
[DefaultValue(true)]
public bool CausesValidation { get; set; }
public string ValidationGroup { get; set; }
[DefaultValue(0)]
public int Tag { get; set; }
#endregion
#region Constructor
public ImgButton()
{
Text = "Text";
ImgSrc = "~/Masters/_default/img/action-help.png";
UseSubmitBehavior = true;
CausesValidation = true;
}
#endregion
#region Events
// Defines the Click event.
public event EventHandler Click;
public event CommandEventHandler Command;
protected virtual void OnClick(EventArgs e)
{
if (Click != null)
{
Click(this, e);
}
}
protected virtual void OnCommand(CommandEventArgs e)
{
if (Command != null)
{
Command(this, e);
}
RaiseBubbleEvent(this, e);
}
public void RaisePostBackEvent(string eventArgument)
{
if (CausesValidation)
{
Page.Validate(ValidationGroup);
if (!Page.IsValid) return;
}
OnClick(EventArgs.Empty);
if (!String.IsNullOrEmpty(CommandName))
OnCommand(new CommandEventArgs(CommandName, CommandArgument));
}
#endregion
#region Rendering
// Do not wrap in <span> tag
public override void RenderBeginTag(HtmlTextWriter writer)
{
writer.Write("");
}
protected override void RenderContents(HtmlTextWriter output)
{
string click;
string disabled = (Enabled ? "" : "disabled ");
string type = (String.IsNullOrEmpty(NavigateUrl) && UseSubmitBehavior ? "submit" : "button");
string imgsrc = ResolveUrl(ImgSrc ?? "");
if (String.IsNullOrEmpty(NavigateUrl))
click = Page.ClientScript.GetPostBackEventReference(this, "");
else
if (NavigateUrl != null)
click = String.Format("location.href='{0}'", ResolveUrl(NavigateUrl));
else
click = OnClientClick;
switch (RenderStyle)
{
case ImgButtonStyle.Button:
if (String.IsNullOrEmpty(NavigateUrl) && UseSubmitBehavior)
{
output.Write(String.Format(
"<button id=\"{0}\" {1}class=\"{2}\" type=\"{3}\" name=\"{4}\" title=\"{5}\"><img src=\"{6}\" alt=\"{5}\"/>{7}</button>",
ClientID,
disabled,
CssClass,
type,
UniqueID,
ToolTip,
imgsrc,
Text
));
}
else
{
output.Write(String.Format(
"<button id=\"{0}\" {1}class=\"{2}\" type=\"{3}\" name=\"{4}\" onclick=\"javascript:{5}\" title=\"{6}\"><img src=\"{7}\" alt=\"{6}\"/>{8}</button>",
ClientID,
disabled,
CssClass,
type,
UniqueID,
click,
ToolTip,
imgsrc,
Text
));
}
break;
case ImgButtonStyle.Anchor:
output.Write(String.Format(
"<a id=\"{0}\" {1}class=\"{2}\" onclick=\"javascript:{3}\" title=\"{4}\"><img src=\"{5}\" alt=\"{4}\"/>{6}</a>",
ID,
disabled,
CssClass,
click,
ToolTip,
imgsrc,
Text
));
break;
}
}
public override void RenderEndTag(HtmlTextWriter writer)
{
writer.Write("");
}
#endregion
}
这是我在按钮上使用的CSS（其中我在按钮的CssClass属性中放置了“icon”）：
button.icon
{
cursor: pointer;
}
button.icon img
{
margin: 0px;
padding: 0px 5px 0px 5px;
vertical-align: middle;
}
如果您使用链接按钮，可以通过CSS的“after”属性添加Bootstrap按钮并添加文本。
链接按钮：
<asp:LinkButton id="download" CssClass="btn btn-primary" Text="Download" OnCommand="OnButtonClick" CommandName="Download" runat="server">
<span aria-hidden="true" class="glyphicon glyphicon-download-alt"></span></asp:LinkButton>
CSS：
#MainContent_download:after{
content: "Download";
padding-left: 5px;
}
你也可以使用 asp:Label 来实现这个功能，代码如下：
<style type="text/css">
.faux-button
{
cursor:pointer;
}
</style>
<div class="faux-button">
<asp:ImageButton ID="ibtnAddUser"
runat="server"
ImageUrl="~/Images/add.gif"
AlternateText="Add a user image" />
<asp:Label ID="lblAddUser"
runat="server"
Text="Add User"
AssociatedControlID="imgClick" />
</div>
<div style="padding: 5px; float: left;overflow: auto;height: auto;">
<asp:ImageButton ID="ImageButton2" ImageUrl="./icons/search24.png" ToolTip="Search" runat="server" />
<p><asp:Label ID="Label7" runat="server" Text="Search"></asp:Label></p>
</div>
您可以更改 style 以使其居中对齐等。
我认为你不能在ASP.NET的ImageButton控件上写文本。如果需要生成图像，可以动态生成图像，并从代码后台编写文本，但这将会过于复杂。除非你的图像无法通过CSS生成，否则请使用带有CSS的普通按钮。