Aplicar formato a los elementos en el Editor HTML de Visual Web Developer

Actualización: noviembre 2007

Al trabajar en el diseñador HTML, el editor puede ayudarle a dar formato a los elementos. En este tema se describen las funciones de formato del editor para trabajar con elementos de código de formato.

Formato predeterminado

De forma predeterminada, el editor HTML le permite establecer el código de formato como desee, conservando los saltos de línea y la sangría a medida que escribe. El editor incluye características que le ayudan a dar formato a sus elementos. Por ejemplo, si aplica sangría a una línea presionando TAB, también se aplican sangría a las líneas subsiguientes. Puede quitar una sangría de línea mediante MAYÚS+TAB. Se conserva el formato que aplica a la página al cambiar entre las vistas Código fuente y Diseño.

Puede establecer las opciones básicas de tratamiento de los tabuladores por parte del editor en la vista Código fuente. Para obtener información detallada, vea Fichas, HTML, Editor de texto, Opciones (Cuadro de diálogo).

Además, puede establecer opciones que hagan que el editor inserte comillas y etiquetas de cierre automáticamente a medida que escribe. Para obtener información detallada, vea Formato, HTML, Editor de texto, Opciones (Cuadro de diálogo).

Formato y el esquema actual

Algunas opciones de formato, como las mayúsculas y el uso de comillas en atributos, las puede reemplazar el esquema seleccionado para el editor. Por ejemplo, si selecciona el esquema XHTML 1.1 Strict, el editor convierte la etiqueta de mayúsculas y los nombres en minúsculas, ya que el esquema permite sólo nombres en minúsculas.

Especificar las opciones de formato

Al crear elementos, el diseñador da formato al nuevo elemento mediante algunas opciones que se pueden establecer. Por ejemplo, de forma predeterminada, los elementos de cliente (como las etiquetas HTML) se crean con nombres de etiqueta en minúsculas. Las opciones de formato se aplican cuando:

  • Se arrastran controles del Cuadro de herramientas a la página.

  • Se utiliza IntelliSense para crear etiquetas en la vista Código fuente.

  • Se establecen los valores en la ventana Propiedades o en los generadores de propiedades.

  • Se pega un elemento desde el Portapapeles.

  • Se genera código de formato mediante un cuadro de diálogo como Insertar tabla (Cuadro de diálogo) de la vista Diseño.

  • Se da formato manualmente a la selección o el documento.

Para obtener detalles sobre cómo establecer las opciones de formato, vea Formato, HTML, Editor de texto, Opciones (Cuadro de diálogo) y Varios, HTML, Editor de texto, Opciones (Cuadro de diálogo).

Opciones de formato para etiquetas individuales

También se pueden establecer las opciones de formato para etiquetas individualmente, lo que permite personalizar la forma en que el diseñador HTML da formato al código de etiquetas individuales. El formato específico de etiquetas permite establecer:

  • El modo en que se cierran las etiquetas (no se cierran, se terminan automáticamente o se utiliza una etiqueta de cierre independiente).

  • Los saltos de línea en torno a las etiquetas y en ellas.

  • La aplicación de sangría a las etiquetas.

  • Opciones de esquematización.

  • Color de las etiquetas en el editor.

Para obtener información detallada, vea Opciones específicas de etiqueta.

Formato a petición

Puede dar formato al documento, o a una selección, en cualquier momento mediante el comando Dar formato al documento del menú Edición o el menú contextual. Otras opciones de formato disponibles en este menú incluyen las opciones para convertir selecciones en mayúsculas o minúsculas, así como convertir los espacios en tabulaciones (Aplicar tabulaciones a la selección) o tabulaciones en espacios (No aplicar tabulaciones a la selección). Cuando se da formato manualmente, el editor utiliza las opciones de formato establecidas; a menos que explícitamente reemplace una regla, al convertir mayúsculas y minúsculas, por ejemplo. Si cambia las opciones de formato, las puede aplicar al código de formato existente volviendo a aplicar formato al documento.

Reglas para conservar espacios en blanco

El proceso de formato del editor respeta la forma en que HTML debe representar los espacios en blanco en el explorador. Por consiguiente, el editor no cambiará el formato de un elemento si el resultado fuera un cambio de representación de la página. Observará este comportamiento del editor, particularmente cuando se trabaja con código de formato que incluye espacios entre etiquetas.

Por ejemplo, la página puede incluir el siguiente código de formato para dos botones HTML:

<input type="button" id="b1"><input type="button" id="b2">

Cuando se representa la página, los dos botones aparecen sin ningún espacio entre ellos. Si se da formato al documento en el editor, puede que espere que se coloquen las dos etiquetas en sus propias líneas. Sin embargo, si se colocan las etiquetas en dos líneas, el resultado sería un espacio que aparece entre los botones al representar la página, por tanto, el editor no mueve las etiquetas. Si coloca espacios manualmente entre las etiquetas, puede cambiar el formato en un salto de línea, ya que si se vuelve a dar formato, la representación de los botones en el explorador no se verá afectada.

Otro caso habitual en el que las reglas de espacios en blanco reemplazan el formato es entre contenido y la etiqueta de cierre. Por ejemplo, el documento puede contener el elemento siguiente table, en una sola línea:

<table><tr><td>Hello, World</td></tr></table>

Si se vuelve a dar formato manualmente, el resultado es el siguiente:

<table>
    <tr>
        <td>
            Hello, World</td>
    </tr>
</table>

La etiqueta </td> de cierre no se mueve a la siguiente línea, ya que afectaría la representación de la celda. Si se inserta un espacio manualmente entre "Hello, World" y la etiqueta </td> y, a continuación, se vuelve a dar formato al documento, el editor moverá la etiqueta de cierre a la línea siguiente.

Dar formato a código en línea

Como regla general, a la secuencia de comandos de cliente y al código de servidor de las páginas Web ASP.NET se les da formato según la reglas del editor de lenguajes. El comportamiento del retorno de carro, nueva generación de línea, sangría, etc. lo dicta, en todos estos casos, el formateador del lenguaje respectivo. Por ejemplo, el formateador del lenguaje Visual Basic automáticamente aplica sangría a la línea que sigue a una declaración Function.

En la vista Código fuente, a los bloques de secuencias de comandos se les aplicar un nivel de sangría respecto a su elemento principal. A las expresiones en línea, las que empiezan por <%#, <%$ o <%=; no se les aplica formato, se quedan como se escriben. Sin embargo, si escribe un bloque de instrucciones individualmente delimitando con los delimitadores <% %>, el editor aplicará formato al bloque como si fuese un bloque mediante las reglas de sangría del lenguaje adecuado.

Vea también

Referencia

Código fuente (Vista)