Home > Getting Started > ASP.NET Syntax > ASP.NET Syntax for HTML Controls > HtmlImage
HtmlImage Class Img Element
Embeds an image control in a Web Forms document.
Declarative Syntax
<img id="accessID" runat="server"
align= absbottom | absmiddle | baseline | bottom | left | middle | right | texttop | top
alt = "alttext"
border = "borderwidth"
height = "imageheight"
src = "imageURI"
width = "imagewidth"
>
For information on the individual members of this class, see HtmlImage in the class library.
- This control does not require a closing tag.
The HtmlImage server control renders an image file specified by it’s Src property.
The HtmlImage control enables programming of the HTML <img
> element, enabling developers to dynamically set and retrieve image attributes, including the image file’s src, width, height, border, alt, and align attributes.
This sample illustrates use of the HtmlImage control.
The following shows how to dynamically change a displayed image in a Web Forms page based on what the user chooses.
An HtmlSelect control provides the list of user options, in which the value selected determines the image to display.
The sample uses the click event of the HtmlInputButton control to trigger a handler that simply specifies the source path of the image file to be displayed, in this case, from the application’s /images
directory.
<html>
<head>
<script language="C#" runat="server">
void submitHandler ( Object Sender, EventArgs e ) {
image.Src = "images/" + imgSelector.Value;
}
</script>
</head>
<body>
<form runat="server">
<p>Select image file:
<select id="imgSelector" runat="server">
<option value="Earth.gif">Earth</option>
<option value="Jupiter.gif">Jupiter</option>
<option value="Mars.gif">Mars</option>
<option value="Mercury.gif">Mercury</option>
<option value="Neptune.gif">Neptune</option>
<option value="Pluto.gif">Pluto</option>
<option value="Uranus.gif">Uranus</option>
<option value="Saturn.gif">Saturn</option>
<option value="Venus.gif">Venus</option>
</select>
<input type=submit runat="server" value="Apply" onServerClick="chgImage">
<p><img id="image" runat="server" src="/shared/images/earth.gif" /></p>
</form>
</body>
</html>
HtmlImage Class Img Element Web Forms Events and Handlers