HTML - Comentarios

El comentario es un fragmento de código que cualquier navegador web ignora. Es una buena práctica agregar comentarios en su código HTML, especialmente en documentos complejos, para indicar secciones de un documento y cualquier otra nota a cualquiera que esté mirando el código. Los comentarios le ayudan a usted y a otras personas a comprender su código y aumentan la legibilidad del código.

Los comentarios HTML se colocan entre etiquetas. Por lo tanto, cualquier contenido colocado dentro de las etiquetas <! - ... -> se tratará como comentario y el navegador lo ignorará por completo.

Ejemplo

<!DOCTYPE html>
<html>

   <head>  <!-- Document Header Starts -->
      <title>This is document title</title>
   </head> <!-- Document Header Ends -->
	
   <body>
      <p>Document content goes here.....</p>
   </body>
	
</html>

Esto producirá el siguiente resultado sin mostrar el contenido dado como parte de los comentarios:

Comentarios válidos vs inválidos

Los comentarios no se anidan, lo que significa que no se puede colocar un comentario dentro de otro comentario. En segundo lugar, es posible que la secuencia de dos guiones "-" no aparezca dentro de un comentario, excepto como parte de la etiqueta de cierre ->. También debe asegurarse de que no haya espacios en la cadena de comentarios de inicio de.

Ejemplo

Aquí, el comentario dado es un comentario válido y el navegador lo borrará.

<!DOCTYPE html>
<html>

   <head>
      <title>Valid Comment Example</title>
   </head>
	
   <body>
      <!--   This is valid comment -->
      <p>Document content goes here.....</p>
   </body>
	
</html>

Esto producirá el siguiente resultado:

Pero, la siguiente línea no es un comentario válido y el navegador la mostrará. Esto se debe a que hay un espacio entre el corchete de ángulo izquierdo y el signo de exclamación.

<!DOCTYPE html>
<html>

   <head>  
      <title>Invalid Comment Example</title>
   </head>
	
   <body>
      < !--   This is not a valid comment -->
      <p>Document content goes here.....</p>
   </body>
	
</html>

Esto producirá el siguiente resultado:

Comentarios multilínea

Hasta ahora hemos visto comentarios de una sola línea, pero HTML también admite comentarios de varias líneas.

Puede comentar varias líneas con la etiqueta inicial especial <! - y la etiqueta final -> colocada antes de la primera línea y al final de la última línea, como se muestra en el siguiente ejemplo.

Ejemplo

<!DOCTYPE html>
<html>

   <head>  
      <title>Multiline Comments</title>
   </head> 
	
   <body>
      <!-- 
         This is a multiline comment and it can
         span through as many as lines you like.
      -->
      
      <p>Document content goes here.....</p>
   </body>
	
</html>

Esto producirá el siguiente resultado:

Comentarios condicionales

Los comentarios condicionales solo funcionan en Internet Explorer (IE) en Windows, pero otros navegadores los ignoran. Son compatibles desde Explorer 5 en adelante y puede usarlos para dar instrucciones condicionales a diferentes versiones de IE.

Ejemplo

<!DOCTYPE html>
<html>

   <head>  
      <title>Conditional Comments</title>

      <!--[if IE 6]>
         Special instructions for IE 6 here
      <![endif]-->
   </head> 
   
   <body>
      <p>Document content goes here.....</p>
   </body>
	
</html>

Se encontrará con una situación en la que deberá aplicar una hoja de estilo diferente basada en diferentes versiones de Internet Explorer, en tal situación, los comentarios condicionales serán útiles.

Usar etiqueta de comentario

Hay pocos navegadores que admitan la etiqueta <comment> para comentar una parte del código HTML.

Note- La etiqueta <comment> en desuso en HTML5. No utilice este elemento.

Ejemplo

<!DOCTYPE html>
<html>

   <head>
      <title>Using Comment Tag</title>
   </head>
	
   <body>
      <p>This is <comment>not</comment> Internet Explorer.</p>
   </body>
	
</html>

Si está utilizando IE, producirá el siguiente resultado:

Pero si no está utilizando IE, producirá el siguiente resultado:

Comentario de código de script

Aunque aprenderá JavaScript con HTML, en un tutorial separado, pero aquí debe tener en cuenta que si está utilizando Java Script o VB Script en su código HTML, se recomienda colocar ese código de secuencia de comandos dentro de los comentarios HTML adecuados para que los antiguos los navegadores pueden funcionar correctamente.

Ejemplo

<!DOCTYPE html>
<html>

   <head>
      <title>Commenting Script Code</title>
      
      <script>
         <!-- 
            document.write("Hello World!")
         //-->
      </script>
   </head>
	
   <body>
      <p>Hello , World!</p>
   </body>
	
</html>

Esto producirá el siguiente resultado:

Comentarios de hojas de estilo

Aunque aprenderá a usar hojas de estilo con HTML en un tutorial separado, aquí debe tomar nota de que si está usando hojas de estilo en cascada (CSS) en su código HTML, se recomienda poner ese código de hoja de estilo dentro de los comentarios HTML adecuados. para que los navegadores antiguos funcionen correctamente.

Ejemplo

<!DOCTYPE html>
<html>

   <head>
      <title>Commenting Style Sheets</title>
      
      <style>
         <!--
            .example {
               border:1px solid #4a7d49;
            }
         //-->
      </style>
   </head>
	
   <body>
      <div class = "example">Hello , World!</div>
   </body>
	
</html>

Esto producirá el siguiente resultado:

↰ Previous page Next page ↱