Control de ASP.NET a etiqueta HTML equivalente

Estoy buscando una hoja de trucos que me permita mostrarle a un diseñador de HTML los controles asp.net equivalentes para las tags HTML estándar. Como ejemplo, el se representará como un HTML

y un se representará como un HTML . He estado buscando en Google esto en vano. ¿Puede alguien publicar un enlace a una buena hoja de trucos para que los diseñadores de este proyecto puedan entender el marcado en las páginas de aspx más claramente?

Para ser claros, me gustaría un enlace a una lista de los principales controles de ASP.NET, con descripciones de cómo se relacionarían con el HTML estándar. Sería genial si estuviera en formato PDF o en una página web fácil de leer e imprimir. La razón, en mi caso, sería que tenemos un desarrollador PHP que está muy familiarizado con el HTML que viene a trabajar en nuestro proyecto, y creo que sería útil tener una mejor comprensión de los controles estándar del servidor ASP.NET si pudiera darle una “hoja de trampa”.

Me refiero principalmente al framework .NET 2.0, pero también estamos trabajando con 3.0 / 3.5.

Solutions Collecting From Web of "Control de ASP.NET a etiqueta HTML equivalente"

Esta no es una pregunta simple, ya que depende de la versión de .NEt de la que está hablando y los estados de los controles a veces. Por ejemplo, el PANEL, en 1 y 1.1, rinde a una TABLA, mientras que en versiones posteriores es una DIV.

Pero en general (por 2/3), aquí va:

  • Panel – Div
  • Panel – GroupingText = “###” es Fieldset, leyenda
  • Etiqueta – Span
  • Botón – Entrada, tipo de botón
  • Botón de enlace – Href con JS Postback Script
  • Hipervínculo – Estándar HREF
  • Botón de imagen – Entrada, tipo de imagen
  • Cuadro de texto: el valor predeterminado es Entrada, texto tipo
  • Textbox – Mode = Password es Input, escribe Password
  • Textbox – Mode = Multiline es Textarea
  • DropDownList – Seleccionar
  • Listbox – Seleccionar
  • RadioButton – Entrada, Radio con GroupName
  • Casilla de verificación – Entrada, checkbox
  • Repeater / Listview –Complex.
  • Gridview – Tabla
  • Tabla – Tabla
  • Archivo – Entrada, Tipo = Archivo

    Eso es lo básico. Los controles más esotéricos, como el control LOGIN, son una tabla con muchas probabilidades y extremos.

La lista de Stephen es bastante completa. Sin embargo, le agregaría las siguientes notas:

En su mayoría, depende de los BrowserCaps conocidos.

Un 1.x Panel se representará como un div en IE6 +; sin embargo, en Firefox (u otros navegadores “DownStream”) se consideró DownStream porque no había detalles del mismo en Machine.Config de forma predeterminada, se representará como una sola celda. Table – esto podría resolverse suministrando BrowserCaps actualizados para Firefox / Opera / Safari / etc, ya sea en Machine.Config o Web.Configs.

Además, los Adaptadores de control pueden cambiar la salida; por ejemplo, los adaptadores de control CSS generarán divs con estilo para la mayoría de los controles tabulares (inicio de sesión, registro, repetidores, etc.).

Tenga en cuenta que se anunció en TechEd / PDC que ASP.NET 4.0 tendrá los adaptadores de control CSS integrados de forma predeterminada.

Esto no responde directamente a su pregunta, pero en muchos casos, puede agregar runat = “server” a una etiqueta HTML normal para que ASP.Net esté al tanto de esto. Eso podría facilitar las cosas para el diseñador, si desea poder cambiar dinámicamente la página, pero aún así permitir que el diseñador trabaje en ella.

Editar:

Una cosa que olvidé mencionar (como lo señala steve_c) es que agregar runat = “server” cambiará la identificación de la etiqueta, lo que puede ser un poco molesto. No está de suerte si usa la ID en su CSS, pero en su JavaScript puede agregar algo como < % = myDiv.ClientID%> para obtener la ID que generó .Net.

htmlgenericcontrol podría ser útil si necesita generar una etiqueta específica

 protected void CreateHeaders(List group_Info) { foreach (Group_Info gi in group_Info) { HtmlGenericControl groupContainer = new HtmlGenericControl("DIV"); String lastLableID = "disp" + gi.GroupName.ToString().Replace(" ", ""); groupContainer.ID = lastLableID; groupContainer.Attributes.Add("class", "content-groups"); HtmlGenericControl groupTitle = new HtmlGenericControl("DIV"); groupTitle.ID = lastLableID + "Sub1"; if (gi.GroupName.Trim().Length == 0) groupTitle.Attributes.Add("class", "titlebar-hidden"); else { groupTitle.Attributes.Add("class", "titlebar"); groupTitle.InnerText = gi.GroupName.ToString().Trim(); } groupContainer.Controls.Add(groupTitle); CreateFields(gi, ref groupContainer); this.pageContainer.Controls.Add(groupContainer); } }