El DOCTYPE
Esta declaración debe ser lo primero en un documento HTML. No es un tag de HTML, es una instrucción para indicarle al navegador en que versión de HTML esta escrito el documento.
1 |
<!DOCTYPE html> |
La raíz HTML
Es el contenedor de todos los elementos HTML. Se puede/debe llevar la etiqueta lang para indicar el lenguaje en el cual esta el contenido del documento.
La cabecera
Es un contenedor para todos los elementos cabecera.
El elemento <head> debe incluir el titulo del documento y puede incluir scripts, estilos, meta información y mas.
Los elementos utilizados dentro de <head> son:
- <title> Es obligatoria
- <style> Se usa para definir los estilos para el documento, es decir el CSS. Lleva el atributo type con el valor text/css
- <base> Cambia la dirección base de las direcciones y la carga de archivos. Se puede especificar el lugar de apertura para las URL con el atributo target y los valores _blank, _self, _parent y _top
- <link> Se utiliza para hacer la carga de archivos externos. Utiliza los atributos: rel para indicar la relación, type para especificar el tipo de documento, href para indicar la ubicación.
- <meta> Funciona para otorgar información de los datos del documento. Debe tener el atributo name para indicar el nombre del metadato y los otros valores a otorgar son charset, content y http-equiv.
- <script> Permite introducir scripts para su uso dentro del documento. Lleva el atributo type donde se indica el tipo de script.
- <noscript> Mostrará el contenido dentro de estas etiquetas en caso de que el navegador no soporte los scripts.
El cuerpo
Contiene todo el código que se debe mostrar dentro del navegador.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
<!DOCTYPE html> <html lang="es"> <head> <title>Título de la página</title> <style type="text/css"> h1 {color:red} p {color:blue} </style> <link rel="stylesheet" type="text/css" href="style.css" /> <link rel="shortcut icon" type="image/png" href="favicon.png" /> <meta name="description" content="Free Web tutorials" /> <meta name="keywords" content="HTML,CSS,XML,JavaScript" /> <meta name="author" content="Ståle Refsnes" /> <meta charset="UTF-8" /> <script type="text/javascript"> document.write("Hello World!") </script> </head> <body> <noscript>Tu navegador no soporta JavaScript!</noscript> Lo escrito aqui aparecerá en el navegador. </body> </html> |
¿Te gustó este artículo?
Si te gustó este artículo, te ha servido o aprendiste algo nuevo; compártelo en tus redes sociales o invítame un cafe.