Definición: Las etiquetas HTML son fragmentos de texto rodeados por corchetes angulares < >
, que tienen funciones y usos específicos y se utilizan para escribir código HTML.
Las etiquetas o tags son la forma de escribir código HTML.
En HTML existen etiquetas de apertura y etiquetas de cierre, tienen la forma: <etiqueta> </etiqueta>
. Donde <etiqueta>
es la etiqueta de apertura y </etiqueta>
es la etiqueta de cierre indicada por la diagonal. HTML tiene definidas gran variedad de etiquetas para distintos usos.
Aunque la mayoría de las etiquetas tienen su etiqueta de apertura y etiqueta de cierre, es importante aclarar que no todas las etiquetas tienen su correspondiente etiqueta de cierre.
Algunos ejemplos de etiquetas son:
Apertura | Cierre |
---|---|
<html> |
</html> |
<head> |
</head> |
<body> |
</body> |
<p> |
</p> |
La etiqueta de apertura y la de cierre son las misma con la única diferencia de la diagonal "/" , es necesario la etiqueta de cierre para limitar el campo de acción de la etiqueta, por ejemplo a etiqueta <p>
nos indica el inicio de un párrafo de texto y una vez que se escribe la etiqueta de apertura el navegador tomará como párrafo todo el texto que se encuentre después de dicha etiqueta hasta toparse con la etiqueta de cierre </p>
y así con las demás etiquetas según la función de cada una, la mayoría de las etiquetas de HTML son etiquetas de este tipo.
Etiqueta |
---|
<br> |
<img> |
<hr> |
<input> |
Este segundo grupo de etiquetas no requieren de una etiqueta de cierre debido a que su campo de acción está limitado al lugar en donde se incluye la etiqueta.
En el primer ejemplo vemos la etiqueta <br>
que sirve para indica un salto de linea, creo que es fácil deducir porque no necesita etiqueta de cierre, pues es un elemento muy simple y el navegador no necesita que le digamos hasta donde "limitar" el campo de acción de esta etiqueta pues los saltos de linea son solo eso "un cambio de renglón y ya", si queremos mas de un salto de linea simplemente escribimos varios <br>
seguidos, la segunda etiqueta <img>
sirve para insertar una imagen en la página tampoco necesita etiqueta de cierre, ya que la etiqueta se debe ubicar en el lugar en donde queramos insertar la imagen, pero hace falta algo mas para completar la etiqueta ya que un simple "img" no nos dice nada acerca de la imagen, para ello existen los atributos.
Atributos de etiquetas.
Las etiquetas tienen atributos que nos sirven para especificar ciertos detalles de esa etiqueta, por ejemplo, especificar un color de texto o de fondo, el ancho y alto de algún elemento, su alineación, la ubicación de un documento o imagen, etc.
El segundo caso del ejemplo anterior vimos que <img>
sirve para insertar una imagen, pero para que la etiqueta funcione necesita de sus atributos, por medio de estos le daremos uso a la etiqueta.
Los atributos se escriben dentro de la etiqueta de la siguiente forma:
<etiqueta atributo1="algo" atributo2="algo">
Ahora volviendo al ejemplo de la etiqueta <img>
es necesario indicar en forma de un atributo la dirección y el nombre de la imagen que queremos que se muestre, esto de la siguiente manera:
<img src="/carpeta/mi_imagen.jpg">
Con lo anterior nuestra etiqueta <img>
ya podrá mostrar la imagen deseada.
Hay atributos específicos para cada etiqueta, en este ejemplo mostramos la etiqueta <img>
con el mínimo requerido, pero puede llevar mas atributos, que no mencionaré aquí pues no es el tema a tratar, pero si hay que decir que a cualquier etiqueta de HTML se le puede agregar atributos, para algunas etiquetas como esta, será algo forzoso agregar el atributo, pero para otras podrá ser algo opcional, sin embargo, las etiquetas y sus atributos son la base del lenguaje HTML, y por medio de estas es como se construye una página web.
¿Qué es HTML?
Cómo crear una página HTML