ASP.NETのWebページでは、HTMLのソースでHTMLのマークアップとASP.NETのWebコントロールが混在していますが、
ユーザがWebページを訪れた際は全てHTMLマークアップとしてWebページが生成されています。
これはユーザがWebページを訪れると各Webコントロールは対応しているHTMLマークアップに変換・生成されて、
元々の静的HTMLマークアップと合わせてブラウザに表示されます。
そこで、今回はそのASP.NETのWebコントロールに対応づけられているHTMLタグをまとめてみました。
※特に何もHTMLタグが生成されなかったものは空欄となっています。
ASP.NET Webコントロール - HTML
| コントロール名 | ASPタグ | HTMLタグ |
|---|---|---|
| AdRotator | <asp:AdRotator ID=”AdRotator1″ runat=”server” /> | <a id=”AdRotator1″ target=”_top”><img></a> |
| BulletedList | <asp:BulletedList ID=”BulletedList1″ runat=”server”></asp:BulletedList> | - |
| Button | <asp:Button ID=”Button1″ runat=”server” Text=”Button” /> | <input type=”submit” name=”Button1″ value=”Button” id=”Button1″> |
| Calendar | <asp:Calendar ID=”Calendar1″ runat=”server”></asp:Calendar> | <table id=”Calendar1″ cellspacing=”0″ cellpadding=”2″ title=”カレンダー” style=”border-width:1px;border-style:solid;border-collapse:collapse;”> <tbody><tr><td colspan=”7″ style=”background-color:Silver;”><table cellspacing=”0″ style=”width:100%;border-collapse:collapse;”> <tbody>〜略〜 </tbody></table> |
| CheckBox | <asp:CheckBox ID=”CheckBox1″ runat=”server” /> | <input id=”CheckBox1″ type=”checkbox” name=”CheckBox1″> |
| CheckBoxList | <asp:CheckBoxList ID=”CheckBoxList1″ runat=”server”></asp:CheckBoxList> | - |
| DropDownList | <asp:DropDownList ID=”DropDownList1″ runat=”server”></asp:DropDownList> | <select name=”DropDownList1″ id=”DropDownList1″></select> |
| FileUpload | <asp:FileUpload ID=”FileUpload1″ runat=”server” /> | <input type=”file” name=”FileUpload1″ id=”FileUpload1″> |
| HiddenField | <asp:HiddenField ID=”HiddenField1″ runat=”server” /> | <input type=”hidden” name=”HiddenField1″ id=”HiddenField1″> |
| <input type=”hidden” name=”HiddenField1″ id=”HiddenField1″> | <asp:HyperLink ID=”HyperLink1″ runat=”server”>HyperLink</asp:HyperLink> | <a id=”HyperLink1″>HyperLink</a> |
| Image | <asp:Image ID=”Image1″ runat=”server” /> | <img id=”Image1″> |
| ImageButton | <asp:ImageButton ID=”ImageButton1″ runat=”server” /> | <input type=”image” name=”ImageButton1″ id=”ImageButton1″> |
| ImageMap | <asp:ImageMap ID=”ImageMap1″ runat=”server”></asp:ImageMap> | <img id=”ImageMap1″> |
| Label | <asp:Label ID=”Label1″ runat=”server” Text=”Label”></asp:Label> | <span id=”Label1″>Label</span> |
| LinkButton | <asp:LinkButton ID=”LinkButton1″ runat=”server”>LinkButton</asp:LinkButton> | <a id=”LinkButton1″ href=”javascript:__doPostBack(‘LinkButton1’,”)”>LinkButton</a> |
| ListBox | <asp:ListBox ID=”ListBox1″ runat=”server”></asp:ListBox> | <select size=”4″ name=”ListBox1″ id=”ListBox1″></select> |
| Literal | <asp:Literal ID=”Literal1″ runat=”server”></asp:Literal> | - |
| Localize | <asp:Localize ID=”Localize1″ runat=”server”></asp:Localize> | - |
| MultiView | <asp:MultiView ID=”MultiView1″ runat=”server”></asp:MultiView> | - |
| Panel | <asp:Panel ID=”Panel1″ runat=”server”></asp:Panel> | <div id=”Panel1″></div> |
| PlaceHolder | <asp:PlaceHolder ID=”PlaceHolder1″ runat=”server”></asp:PlaceHolder> | - |
| RadioButton | <asp:RadioButton ID=”RadioButton1″ runat=”server” /> | <input id=”RadioButton1″ type=”radio” name=”RadioButton1″ value=”RadioButton1″> |
| RadioButtonList | <asp:RadioButtonList ID=”RadioButtonList1″ runat=”server”></asp:RadioButtonList> | - |
| Substitution | <asp:Substitution ID=”Substitution1″ runat=”server” /> | - |
| Table | <asp:Table ID=”Table1″ runat=”server”></asp:Table> | <table id=”Table1″></table> |
| TextBox | <asp:TextBox ID=”TextBox1″ runat=”server”></asp:TextBox> | <input name=”TextBox1″ type=”text” id=”TextBox1″> |
| View | <asp:View ID=”View1″ runat=”server”></asp:View> | - |
| Wizard | <asp:Wizard ID=”Wizard1″ runat=”server”> <WizardSteps> <asp:WizardStep ID=”WizardStep1″ runat=”server” Title=”Step 1″></asp:WizardStep> <asp:WizardStep ID=”WizardStep2″ runat=”server” Title=”Step 2″></asp:WizardStep> </WizardSteps> </asp:Wizard> | <table cellspacing=”0″ cellpadding=”0″ id=”Wizard1″ style=”border-collapse:collapse;”> <tbody><tr> <td style=”height:100%;”>〜略〜</td> </tr><tr> <td align=”right”><table cellspacing=”5″ cellpadding=”5″> <tbody><tr> <td align=”right”>省略</td> </tr> </tbody></table></td> </tr> </tbody></table></td> </tr> </tbody></table> |
| Xml | <asp:Xml ID=”Xml1″ runat=”server”></asp:Xml> | - |
ASP.NET おすすめ入門講座
3つのWebアプリケーションの開発を通して、ASP.NETについて基礎から学べるおすすめの入門講座がこちら☟
【入門者向け】ASP.NET MVCでWebアプリ開発のノウハウを学ぼう！
