4.18 Introducción a HTML: estructura básica, etiquetas y atributos
HTML, que significa lenguaje de marcado de hipertexto, es el lenguaje de marcado estándar para crear páginas web y aplicaciones. Combinado con tecnologías como CSS (hojas de estilo en cascada) y JavaScript, HTML forma la tríada de herramientas esenciales para la web.
Estructura básica de HTML
Un documento HTML básico tiene una estructura muy simple. Comienza declarando el tipo de documento, que para HTML5 es simplemente <!DOCTYPE html>. Luego viene el elemento <html> que envuelve todo el contenido de la página. Dentro de este, tenemos dos elementos principales: <head> y <body>.
El elemento <head> contiene metadatos sobre el documento, como su título (que aparece en la barra de título o en la pestaña del navegador), enlaces a hojas de estilo CSS, scripts JavaScript y otra información variada. que no se presenta al usuario.
El elemento <body> es donde reside todo el contenido que el usuario ve y con el que interactúa. Esto incluye texto, imágenes, vídeos, formularios, botones y todos los demás elementos interactivos de la página.
Etiquetas y atributos HTML
Las etiquetas HTML son los componentes básicos de cualquier página web. Definen y describen el contenido. Cada etiqueta comienza con un corchete angular (<) y termina con un corchete angular (>). La mayoría de las etiquetas HTML tienen una etiqueta de apertura y una etiqueta de cierre, con contenido intermedio.
- Escuche el audio con la pantalla apagada.
- Obtenga un certificado al finalizar.
- ¡Más de 5000 cursos para que explores!
Descargar la aplicación
Por ejemplo, <p>Este es un párrafo.</p>. Aquí, <p> es la etiqueta de apertura, </p> es la etiqueta de cierre y cualquier valor intermedio es el contenido de la etiqueta. p>
Los atributos HTML proporcionan información adicional sobre los elementos. Vienen en pares de nombre/valor y siempre se incluyen en la etiqueta de apertura. Por ejemplo, en la etiqueta de imagen <img src="imagem.jpg" alt="Una imagen">, src y alt son atributos.
Propiedades y valores CSS
CSS, u hojas de estilo en cascada, es un lenguaje de hojas de estilo utilizado para describir la apariencia de un documento escrito en HTML. Le permite controlar cosas como el color del texto, el tamaño de fuente, el espacio entre párrafos, el tamaño y la disposición de las columnas, qué tipos de imágenes o colores de fondo usar, etc.
Propiedades CSS
Las propiedades CSS son los aspectos de HTML que puedes cambiar o manipular. Por ejemplo, puede cambiar el color, el margen, el relleno, la altura, el ancho, el borde, el tamaño de fuente, la familia de fuentes, la altura de la línea, la alineación del texto, la posición, el estilo de fuente, la lista, la tabla de diseño y más.
Valores CSS
Los valores son lo que usted establece o usa para cambiar las propiedades de CSS. Por ejemplo, si la propiedad es 'color', los valores posibles podrían ser 'rojo', 'verde', 'rgb(255,0,0)', '#FF0000', etc. Cada propiedad tiene su propio conjunto de valores posibles, algunos de los cuales están predefinidos, mientras que otros pueden ser definidos por el usuario.
Por ejemplo, la propiedad 'font-size' controla el tamaño del texto. Si desea que su texto se muestre en un tamaño de 16 píxeles, debe usar la propiedad y el valor de esta manera: font-size: 16px;.
En resumen, HTML y CSS son herramientas fundamentales para cualquier desarrollador web. HTML proporciona la estructura y el contenido de la página, mientras que CSS le permite controlar exactamente cómo se ve esa página. Con un buen conocimiento de estos dos idiomas, podrás crear páginas web dinámicas y atractivas.
