¿Son válidas las etiquetas de cierre automático (no nulas) en HTML5?
Al validador del W3C ( Wikipedia ) no le gustan las etiquetas de cierre automático (aquellas que terminan con " />") en elementos no vacíos . ( Los elementos vacíos son aquellos que nunca pueden contener ningún contenido). ¿Siguen siendo válidos en HTML5?
Algunos ejemplos de elementos vacíos aceptados :
<br />
<img src="" />
<input type="text" name="username" />
Algunos ejemplos de elementos no vacíos rechazados :
<div id="myDiv" />
<span id="mySpan" />
<textarea id="someTextMessage" />
El validador del W3C en realidad acepta etiquetas de cierre automático nulas: el autor originalmente tuvo un problema debido a un simple error tipográfico (
\>en lugar de />); sin embargo, las etiquetas de cierre automático no son 100% válidas en HTML5 en general, y las respuestas profundizan en el tema de las etiquetas de cierre automático en varios tipos de HTML.
(Teóricamente) en HTML 4 ,
<foo /(sí, sin ningún significado>) significa<foo>(lo que conduce al<br />significado<br>>(es decir<br>>,) y<title/hello/al significado<title>hello</title>). Utilizo el término "teóricamente" porque se trata de una regla SGML que los navegadores no soportan muy bien. Hubo tan poco soporte (solo lo vi funcionar en emacs-w3m ) que la especificación recomienda a los autores evitar la sintaxis .En XHTML ,
<foo />significa<foo></foo>. Esta es una regla XML que se aplica a todos los documentos XML. Dicho esto, a menudo se sirve XHTML comotext/htmlalgo que (al menos históricamente) es procesado por los navegadores utilizando un analizador diferente al de los documentos servidos comoapplication/xhtml+xml. El W3C proporciona pautas de compatibilidad a seguir para XHTML comotext/html. (Esencialmente: utilice únicamente la sintaxis de etiquetas de cierre automático cuando el elemento esté definido como VACÍO (y la etiqueta final esté prohibida en la especificación HTML)).En HTML5 , el significado de
<foo />depende del tipo de elemento :- En los elementos HTML que están designados como elementos nulos (esencialmente "Un elemento que existía antes de HTML5 y cuyo contenido estaba prohibido"), las etiquetas finales simplemente están prohibidas. La barra diagonal al final de la etiqueta de inicio está permitida, pero no tiene significado. Es simplemente azúcar sintáctico para las personas (y resaltadores de sintaxis) adictas a XML.
- En otros elementos HTML, la barra diagonal es un error , pero la recuperación de errores hará que los navegadores la ignoren y traten la etiqueta como una etiqueta de inicio normal. Por lo general, esto terminará con la falta de una etiqueta final, lo que provocará que los elementos posteriores sean hijos en lugar de hermanos.
- Los elementos extraños (importados de aplicaciones XML como SVG) lo tratan como una sintaxis de cierre automático.
Un div que se cierra automáticamente no se validará. Esto se debe a que un div es un elemento normal , no un elemento vacío .
Según la especificación HTML5 , las etiquetas que no pueden tener ningún contenido (conocidas como elementos vacíos ) pueden cerrarse automáticamente*. Esto incluye las siguientes etiquetas:
area, base, br, col, embed, hr, img, input,
link, meta, param, source, track, wbr
Sin embargo, "/" es completamente opcional en las etiquetas anteriores, por lo que <img/>no es diferente de <img>, pero <img></img>no es válido.
*Nota: los elementos extraños también pueden cerrarse automáticamente, pero no creo que esté dentro del alcance de esta respuesta.
Básicamente, HTML5 se comporta como si la barra diagonal final no estuviera allí. No existe una etiqueta de cierre automático en la sintaxis HTML5.
Las etiquetas de cierre automático en elementos no vacíos
<p/>como<div/>no funcionarán en absoluto. La barra diagonal final se ignorará y se tratarán como etiquetas de apertura. Es probable que esto provoque problemas de anidación.Esto es cierto independientemente de si hay espacios en blanco delante de la barra diagonal:
<p />y<div />tampoco funcionará por la misma razón.Las etiquetas de cierre automático en elementos vacíos como
<br/>o<img src="" alt=""/>funcionarán , pero solo porque se ignora la barra diagonal final y, en este caso, eso da como resultado el comportamiento correcto.
El resultado es que todo lo que funcionaba en su antiguo "XHTML 1.0 servido como texto/html" seguirá funcionando como antes: las barras diagonales finales en etiquetas no vacías tampoco se aceptaron allí, mientras que las barras diagonales finales en elementos vacíos funcionaron.
Una nota más: es posible representar un documento HTML5 como XML, y esto a veces se denomina "XHTML 5.0". En este caso se aplican las reglas de XML y siempre se manejarán las etiquetas de cierre automático. Siempre deberá entregarse con un tipo mime XML.
Jun 28 '2016 06:06
Las etiquetas de cierre automático son válidas en HTML5, pero no son obligatorias.
<br>y <br />ambos están bien.
