Кнопка с изображением и текстом

Question

Можно создать дубликат:
Text on an Image button in c# asp.net 3.5

Я хочу, чтобы кнопка asp.net с текстом на левой и изображения на правой

Answer 1

Вот один я писал:

public class WebImageButton : LinkButton, IButtonControl 
{ 
    protected override void OnPreRender(EventArgs e) 
    { 
     if (!this.DesignMode) 
     { 
      // Apply the image 
      if (this.Image.Length > 0) 
      { 
       this.Style.Add("background-image", "url(" + this.Image + ")"); 
       this.Style.Add("background-repeat", "no-repeat"); 
       this.Style.Add("background-position", this.ImageHorizontalOffset + " " + this.ImageVerticalOffset); 
      } 
     } 

     base.OnPreRender(e); 
    } 

    [DescriptionAttribute("The path to the default image to be displayed.")] 
    public string Image 
    { 
     get 
     { 
      if (_image == null) 
      { 
       return string.Empty; 
      } 
      return _image; 
     } 
     set 
     { 
      _image = value; 
     } 
    } 
    private string _image; 

    [DescriptionAttribute("The unit to offset the image by horizontally.")] 
    public string ImageHorizontalOffset 
    { 
     get 
     { 
      return _imageHorizontalOffset; 
     } 
     set 
     { 
      _imageHorizontalOffset = value; 
     } 
    } 
    private string _imageHorizontalOffset = "0px"; 

    [DescriptionAttribute("The unit to offset the image by vertically.")] 
    public string ImageVerticalOffset 
    { 
     get 
     { 
      return _imageVerticalOffset; 
     } 
     set 
     { 
      _imageVerticalOffset = value; 
     } 
    } 
    private string _imageVerticalOffset = "center"; 

} 

Тогда CSS, который сопровождает его:

.ImageButton 
{ 
    background:#666; 
    border:solid 1px #000; 
    color:#FFF; 
    font-size:10pt; 
    font-weight:bold; 
    padding:4px; 
    text-align:center; 
    cursor:hand; 
} 

И пример его использования:

<ctrl:WebImageButton ID="WebImageButton1" runat="server" 
    OnClick="WebImageButton1_Click" CssClass="ImageButton" Text="Click me" 
    ImageHorizontalOffset="4px" /> 

Answer 2

я не уверен, если есть какие-либо элементы управления asp, которые позволяют вам это делать (но я могу ошибаться). То, что вы захотите обмануть, - это, возможно, divs и их события onclick. Тогда вы можете сделать что-то вроде onclick="Javascript:this.form.submit();". Вы сможете отсортировать div как угодно и вставить то, что вы хотите (в вашем случае текст и изображение).

Редактировать: Затем в css вы также можете добавить #mydiv:hover { cursor: pointer; } Чтобы получить значок руки, когда пользователи перемещают курсор над div.

Но, похоже, Гейдж при условии ссылки на чьего-то решения: P Удачи

Answer 3

Вы можете использовать CSS для применения изображения к фону элемента ввода. Прочтите в фоновом изображении метод CSS:

http://www.w3schools.com/css/pr_background-image.asp