ASP.NET Controls to HTML Elements Equivalent

If you are developing web application using ASP.NET, you must be concerned that what will be the equivalent HTML element for ASP.NET controls used on your web pages.

If you are developing web application using ASP.NET, you must be concerned that what will be the equivalent HTML element for ASP.NET controls used on your web pages.
 
Undoubtedly, ASP.NET controls are great that makes our life easy during web application development. Also these controls put a level of abstraction to what is going to render in browser. ASP.NET developers must understand what is going to render against each control in browser that helps in identifying the issues encountered. Also, it will help in managing the overall layout of our page.

Following is the mapping between ASP.NET controls and HTML Elements.

ASP.NET Control	HTML Element	Rendered HTML
Label	Label	<label  for="male">Male</label>
Button	Input	<input type="Button">
TextBox	Input	<input type="text" name="Username">
TextBox, Mode Password	Input	<input Type="password" name="pass">
TextBox, Mode Multiline	TextArea	<textarea rows="5" cols="20" ></textarea>
Link Button	HREF with JS Postback Script	<a href="javascript:__doPostBack('','')">Click Me</a>
Hyperlink	Standard HREF	<a href=""> Click Me </a>
DropDownList	Select	<select name="subjects"><option value="1">English</option><option value="2">Arabic</option></select>
ListBox	Select	<select name="subjects"><option value="1">English</option><option value="2">Arabic</option></select>
Image Button	Input	<input type="Image" src="submit.gif" alt="Submit Form">
RadioButton	Input radio	<input Type="radio" >
CheckBox	Input Checkbox	<input Type="checkbox" >
File	Input	<input type="file" name="Certificate" accept="image/*" >
Panel/Update Panel	Div	<div ></div>
GridView	Table	<table></table>
Table	Table	<table></table>