Image Example in ASP.NET using C#

In this article we will introduce with Image control in ASP.NET using C#.

Image Example in ASP.NET using C#

Image control in ASP.NET is used for designing the webpage and many other purpose. You can use image at design time or at run time(programmatically). The image control doesn't support mouse click event. In this example we use two images first one at Design time and second one at run time. The image control has many properties. You can see properties of Image control in property window.

Image.aspx (Design page):

Image.aspx (source page):

		<%@
		Page
		Title=""
		Language="C#"
		MasterPageFile="~/RoseindiaMaster.master"
		
		
		AutoEventWireup="true"
		CodeFile="Image.aspx.cs"
		Inherits="Image" 
		%>
		
		<asp:Content
		ID="Content1"
		
		ContentPlaceHolderID="head"
		Runat="Server">
		</asp:Content>
		<asp:Content
		ID="Content2"
		
		ContentPlaceHolderID="ContentPlaceHolder1"
		Runat="Server">
		<div>
		<h2
		style="color:Green">Image 
		in ASP.NET 4 , C#</h2>
		<asp:Label
		ID="label1"
		runat="server"
		Text="Show 
		image at Design time" 
		Font-Bold="True"
		ForeColor="#E10000"
		/>
		
		<br
		/>
		
		<br
		/>
		<asp:Image
		ID="image1"
		runat="server"
		BorderColor="Yellow"
		BorderStyle="Ridge"
		
		BorderWidth="10px"
		ImageUrl="~/Images/colorful.jpg"
		/>
		
		<br
		/>
		
		<br
		/>
		<asp:Label
		ID="label2"
		runat="server"
		Text="Show 
		image at Run time" 
		Font-Bold="True"
		ForeColor="#EC0000"
		/>
		
		<br
		/>
		
		<br
		/>
		<asp:Image
		ID="image2"
		runat="server"
		BorderColor="Yellow"
		BorderStyle="Outset"
		
		BorderWidth="10px"
		/>
		</div>
		</asp:Content>
		

Image.aspx.cs (C# code file):

		using System;
		
		using 
		System.Collections.Generic;
		
		using System.Linq;
		
		using System.Web;
		
		using System.Web.UI;
		
		using System.Web.UI.WebControls;
		
		public 
		partial
		class
		Image 
		: System.Web.UI.Page
		
		{
		protected
		void 
		Page_Load(object 
		sender, EventArgs 
		e)
		{
		image2.ImageUrl = 
		"~/Images/morning.jpg";
		}
		}
		

Output:

In the following figure you can see how can I use the Image at design time and run time.