Читать книгу El gran libro de HTML5, CSS3 y Javascript - Diego Gauchat Juan - Страница 9
1.2.1 Etiquetas y elementos
ОглавлениеEfectivamente, el código HTML no es un conjunto secuencial de instrucciones sino es un lenguaje de marcado, un conjunto de etiquetas que por lo general vienen en pares y que pueden ser anidadas (contenidas dentro de otros elementos). Estas etiquetas son palabras clave y atributos encerrados entre corchetes angulares (por ejemplo, <html lang=“en”>). Por lo general, nos referimos a una etiqueta individual simplemente como “etiqueta” y a un par de etiquetas de apertura y cierre como un “elemento”. Observe el siguiente ejemplo:
Código 1-1
Ejemplo de un documento básico de HTML.
Importante
Los conceptos que aquí se explican son básicos pero esenciales para la comprensión de los ejemplos en este libro. Si está familiarizado con esta información, por favor siéntase con la libertad de saltar sobre los temas que ya domina.
Hágalo usted mismo
Un documento HTML es un archivo de texto. Si no dispone de ningún software de desarrollo para crear el archivo, puede utilizar simplemente cualquier editor de texto como el Notepad de Windows. Cree un nuevo archivo con el Código 1-1, guárdelo con un nombre y la extensión .html (por ejemplo, prueba.html) y a continuación abra el archivo en el navegador. Si su editor de texto trabaja con diferentes formatos, asegúrese de guardar el archivo como texto sin formato antes de cambiar su extensión. Para ejecutar el archivo en el navegador configurado por defecto en su ordenador bastará con hacer doble clic sobre él en el explorador de archivos.
Algunos elementos de HTML son simples, es decir, están compuestos de una sola etiqueta, pero la mayoría requiere una etiqueta de apertura y otra de cierre. En el ejemplo del Código 1-1 podemos ver varias etiquetas, una tras otra, con texto e incluso con otras etiquetas en medio. Compare las etiquetas de apertura y de cierre de este ejemplo, y verá que la de cierre se distingue por tener una barra antes de la palabra clave. Por ejemplo, la etiqueta <html> indica el inicio del código HTML, mientras que </html> declara el final. El navegador tratará todo lo que se encuentre en medio de estas etiquetas como código HTML.
Importante
No se preocupe si no entiende cómo se crea la estructura presentada en el Código 1-1. Vamos a trabajar en ello y en los nuevos elementos estructurales introducidos en HTML5 en las próximas páginas.
En este ejemplo, aunque se trata de un código muy sencillo, ya podemos ver una estructura compleja. En la primera línea, hay una sola etiqueta con la definición del documento seguido de la etiqueta de apertura <html lang=“en”>. Entre las etiquetas <html> insertamos otras etiquetas, como las que representan a la cabeza y el cuerpo del documento (<head> y <body>), que también vienen en pares y encierran contenido adicional, como texto o de otros elementos (<title>).
Como se puede ver, para construir un documento HTML, las etiquetas aparecen una tras otra y también entre otras etiquetas, lo que da como resultado en una estructura en árbol, en la que la etiqueta <html> es la raíz.
En general, todo elemento puede ser anidado, ser un contenedor o ser contenido por otros elementos. Básicamente, elementos estructurales especiales como <head>, <html> o <body> tienen un lugar específico en un documento HTML, pero el resto de elementos son flexibles, como veremos más adelante en este mismo capítulo.
