Freigeben über


Deklarative Syntax des Image-Webserversteuerelements

Aktualisiert: November 2007

Zeigt ein webkompatibles Bild auf der Web Forms-Seite an.

<asp:Image
    AccessKey="string"
    AlternateText="string"
    BackColor="color name|#dddddd"
    BorderColor="color name|#dddddd"
    BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
        Inset|Outset"
    BorderWidth="size"
    CssClass="string"
    DescriptionUrl="uri"
    Enabled="True|False"
    EnableTheming="True|False"
    EnableViewState="True|False"
    ForeColor="color name|#dddddd"
    GenerateEmptyAlternateText="True|False"
    Height="size"
    ID="string"
    ImageAlign="NotSet|Left|Right|Baseline|Top|Middle|Bottom|
        AbsBottom|AbsMiddle|TextTop"
    ImageUrl="uri"
    OnDataBinding="DataBinding event handler"
    OnDisposed="Disposed event handler"
    OnInit="Init event handler"
    OnLoad="Load event handler"
    OnPreRender="PreRender event handler"
    OnUnload="Unload event handler"
    runat="server"
    SkinID="string"
    Style="string"
    TabIndex="integer"
    ToolTip="string"
    Visible="True|False"
    Width="size"
/>

Hinweise

Mit dem Image-Steuerelement können Sie ein Bild auf der Web Forms-Seite anzeigen. Der Pfad zu dem anzuzeigenden Bild wird mithilfe der ImageUrl-Eigenschaft angegeben. Mithilfe der AlternateText-Eigenschaft kann der Text angegeben werden, der anstelle des Bilds angezeigt werden soll, falls dieses nicht verfügbar ist. Mit der ImageAlign-Eigenschaft wird die Ausrichtung des Bilds in Bezug auf die anderen Elemente auf der Web Forms-Seite angegeben.

Tipp

Dieses Steuerelement zeigt nur ein Bild an. Wenn das Bild sich wie eine Schaltfläche verhalten soll oder wenn Sie die Koordinaten ermitteln müssen, an denen der Mauszeiger auf das Bild klickt, verwenden Sie das ImageButton-Steuerelement.

Tipp

Da das <asp:Image>-Element über keinerlei Inhalt verfügt, können Sie das Tag anstelle eines separaten Endtags mit /> schließen.

Ausführliche Informationen zu den Eigenschaften und Ereignissen des Image-Webserversteuerelements finden Sie in der Dokumentation zu Image.

Beispiel

Das folgende Beispiel veranschaulicht das Erstellen eines Image-Steuerelements auf einer Webseite.

Tipp

Das folgende Codebeispiel verwendet das Einzeldatei-Codemodell und funktioniert möglicherweise nicht korrekt, wenn es direkt in eine Code-Behind-Datei kopiert wird. Dieses Codebeispiel muss in eine leere Textdatei mit der Erweiterung .aspx kopiert werden. Weitere Informationen über das Web Forms-Codemodell finden Sie unter Codemodell für ASP.NET-Webseiten.

<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Image Example</title>
<script language="VB" runat="server">

      Sub Button_Click(sender As Object, e As EventArgs)
         Select Case DropList1.SelectedIndex
            Case 0:
               Image1.ImageAlign = ImageAlign.NotSet

            Case 1:
               Image1.ImageAlign = ImageAlign.Left

            Case 2:
               Image1.ImageAlign = ImageAlign.Right

            Case 3:
               Image1.ImageAlign = ImageAlign.Baseline

            Case 4:
               Image1.ImageAlign = ImageAlign.Top

            Case 5:
               Image1.ImageAlign = ImageAlign.Middle

            Case 6:
               Image1.ImageAlign = ImageAlign.Bottom

            Case 7:
               Image1.ImageAlign = ImageAlign.AbsBottom

            Case 8:
               Image1.ImageAlign = ImageAlign.AbsMiddle

            Case 9:
               Image1.ImageAlign = ImageAlign.TextTop

            Case Else:
               Image1.ImageAlign = ImageAlign.NotSet

         End Select
      End Sub

   </script>

</head>

<body>

   <form id="form1" runat="server">

      <h3>Image Example</h3>

      <div style="font-size:large">

         Text Text Text Text Text Text Text Text Text Text Text Text 
         Text Text Text Text Text Text Text Text Text Text Text Text 
         Text Text Text Text Text Text Text Text Text Text Text Text

      </div> 

      <asp:Image id="Image1" runat="server"
           AlternateText="Image text"
           ImageAlign="left"
           ImageUrl="images/image1.jpg"/>

      <hr />

      Select Image Align: <br />

      <asp:DropDownList id="DropList1"
           runat="server">

         <asp:ListItem>NotSet</asp:ListItem>
         <asp:ListItem>Left</asp:ListItem>
         <asp:ListItem>Right</asp:ListItem>
         <asp:ListItem>BaseLine</asp:ListItem>
         <asp:ListItem>Top</asp:ListItem>
         <asp:ListItem>Middle</asp:ListItem>
         <asp:ListItem>Bottom</asp:ListItem>
         <asp:ListItem>AbsBottom</asp:ListItem>
         <asp:ListItem>AbsMiddle</asp:ListItem>
         <asp:ListItem>TextTop</asp:ListItem>     

      </asp:DropDownList>

      <br /><br />

      <asp:Button id="Button1"
           Text="Apply Image Alignment"
           OnClick="Button_Click" 
           runat="server"/>

   </form>

</body>
</html>

<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Image Example</title>
<script language="C#" runat="server">

      void Button_Click(Object sender, EventArgs e)
      {
         switch(DropList1.SelectedIndex)
         {
            case 0:
               Image1.ImageAlign = ImageAlign.NotSet;
               break;

            case 1:
               Image1.ImageAlign = ImageAlign.Left;
               break;

            case 2:
               Image1.ImageAlign = ImageAlign.Right;
               break;

            case 3:
               Image1.ImageAlign = ImageAlign.Baseline;
               break;

            case 4:
               Image1.ImageAlign = ImageAlign.Top;
               break;

            case 5:
               Image1.ImageAlign = ImageAlign.Middle;
               break;

            case 6:
               Image1.ImageAlign = ImageAlign.Bottom;
               break;

            case 7:
               Image1.ImageAlign = ImageAlign.AbsBottom;
               break;

            case 8:
               Image1.ImageAlign = ImageAlign.AbsMiddle;
               break;

            case 9:
               Image1.ImageAlign = ImageAlign.TextTop;
               break;

            default:
               Image1.ImageAlign = ImageAlign.NotSet;
               break;

         }

      }

   </script>

</head>

<body>

   <form id="form1" runat="server">

      <h3>Image Example</h3>

      <div style="font-size:large">

         Text Text Text Text Text Text Text Text Text Text Text Text 
         Text Text Text Text Text Text Text Text Text Text Text Text 
         Text Text Text Text Text Text Text Text Text Text Text Text

      </div> 

      <asp:Image id="Image1" runat="server"
           AlternateText="Image text"
           ImageAlign="left"
           ImageUrl="images/image1.jpg"/>

      <hr />

      Select Image Align: <br />

      <asp:DropDownList id="DropList1"
           runat="server">

         <asp:ListItem>NotSet</asp:ListItem>
         <asp:ListItem>Left</asp:ListItem>
         <asp:ListItem>Right</asp:ListItem>
         <asp:ListItem>BaseLine</asp:ListItem>
         <asp:ListItem>Top</asp:ListItem>
         <asp:ListItem>Middle</asp:ListItem>
         <asp:ListItem>Bottom</asp:ListItem>
         <asp:ListItem>AbsBottom</asp:ListItem>
         <asp:ListItem>AbsMiddle</asp:ListItem>
         <asp:ListItem>TextTop</asp:ListItem>     

      </asp:DropDownList>

      <br /><br />

      <asp:Button id="Button1"
           Text="Apply Image Alignment"
           OnClick="Button_Click" 
           runat="server"/>

   </form>

</body>
</html>

<%@ Page Language="JSCRIPT" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Image Example</title>
<script language="JSCRIPT" runat="server">

      function Button_Click(sender : Object, e : EventArgs){
         switch(DropList1.SelectedIndex){
            case 0:
               Image1.ImageAlign = ImageAlign.NotSet
               break
            case 1:
               Image1.ImageAlign = ImageAlign.Left
               break
            case 2:
               Image1.ImageAlign = ImageAlign.Right
               break
            case 3:
               Image1.ImageAlign = ImageAlign.Baseline
               break
            case 4:
               Image1.ImageAlign = ImageAlign.Top
               break
            case 5:
               Image1.ImageAlign = ImageAlign.Middle
               break
            case 6:
               Image1.ImageAlign = ImageAlign.Bottom
               break
            case 7:
               Image1.ImageAlign = ImageAlign.AbsBottom
               break
            case 8:
               Image1.ImageAlign = ImageAlign.AbsMiddle
               break
            case 9:
               Image1.ImageAlign = ImageAlign.TextTop
               break
            default:
               Image1.ImageAlign = ImageAlign.NotSet
               break
         }
      }

   </script>

</head>

<body>

   <form id="form1" runat="server">

      <h3>Image Example</h3>

      <div style="font-size:large">

         Text Text Text Text Text Text Text Text Text Text Text Text 
         Text Text Text Text Text Text Text Text Text Text Text Text 
         Text Text Text Text Text Text Text Text Text Text Text Text

      </div> 

      <asp:Image id="Image1" runat="server"
           AlternateText="Image text"
           ImageAlign="left"
           ImageUrl="images/image1.jpg"/>

      <hr />

      Select Image Align: <br />

      <asp:DropDownList id="DropList1"
           runat="server">

         <asp:ListItem>NotSet</asp:ListItem>
         <asp:ListItem>Left</asp:ListItem>
         <asp:ListItem>Right</asp:ListItem>
         <asp:ListItem>BaseLine</asp:ListItem>
         <asp:ListItem>Top</asp:ListItem>
         <asp:ListItem>Middle</asp:ListItem>
         <asp:ListItem>Bottom</asp:ListItem>
         <asp:ListItem>AbsBottom</asp:ListItem>
         <asp:ListItem>AbsMiddle</asp:ListItem>
         <asp:ListItem>TextTop</asp:ListItem>     

      </asp:DropDownList>

      <br /><br />

      <asp:Button id="Button1"
           Text="Apply Image Alignment"
           OnClick="Button_Click" 
           runat="server"/>

   </form>

</body>
</html>

Siehe auch

Referenz

Image

Weitere Ressourcen

Syntax des Webserversteuerelements