Saltar al contenido principal
LibreTexts Español

9.3: Etiquetas Básicas

  1. Última actualización
  2. Guardar como PDF
  • Page ID
    103302

    • \( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \) \( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)\(\newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\) \( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\) \( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\) \( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\) \( \newcommand{\Span}{\mathrm{span}}\) \(\newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\) \( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\) \( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\) \( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\) \( \newcommand{\Span}{\mathrm{span}}\)\(\newcommand{\AA}{\unicode[.8,0]{x212B}}\)

    Hay toneladas de etiquetas, y es casi imposible memorizarlas todas. Por suerte, tenemos Internet, lo que significa que no tenemos que memorizarlos. En esta sección, conocerás algunas de las etiquetas básicas que se necesitan en casi todas las páginas web.

    Etiquetas de inicio y <head>

    Cada página web HTML comienza con un <! doctype html> etiqueta, sin etiqueta de cierre. Esto es lo que le dice al navegador web en qué versión de HTML está escrita la página. El <! doctype> tag solía tener varias opciones en el HTML antiguo, pero en HTML5, solo hay una: <! doctype html>.

    Después de la <! doctype html> tag, hay una <html>etiqueta, que también se requiere para cada documento HTML. A diferencia del <! doctype html> tag, la <html>etiqueta requiere una etiqueta de cierre de</html>. Para fines de anidamiento, la etiqueta de cierre</html> siempre será lo último en su documento.

    Una vez que <html>se ha abierto la etiqueta, la página tiene entonces la información de su cabeza en la <head>etiqueta, que también tiene una etiqueta de cierre</head> <head>de La etiqueta incluye información que no aparece en la página, pero es vital para la apariencia de la página. Siempre hay una <title>etiqueta con una etiqueta de cierre</title> que encierra la información en la pestaña del navegador web. Los usuarios que están incluyendo información CSS en su documento también pueden incluir codificación CSS en la <head>etiqueta.

    Captura de pantalla 2020-07-01 a las 11.41.36.png

    Figura\(\PageIndex{1}\)

    La <body>etiqueta y otras etiquetas comunes

    Después de que <head>se haya cerrado la etiqueta, la siguiente etiqueta a abrir es la <body>etiqueta. Esto denota la información que realmente ves en la página al mirar un navegador web. Todo lo que ves dentro de la ventana del navegador aparece después de la <body>etiqueta y antes de la etiqueta de cierre</body>.

    Para las etiquetas comunes utilizadas dentro de la <body>etiqueta y su propósito, consulte la Tabla 7.3.1. A menos que se indique lo contrario, todas las etiquetas de la tabla a continuación requieren una etiqueta de cierre.

    Tag Función
    <em> Define el texto enfatizado. El texto encerrado en una <em>etiqueta aparecerá en cursivos.
    <strong> Define texto importante. El texto encerrado en una <strong>etiqueta aparecerá en negrilla

    <img>

    Define una imagen. Esta etiqueta requiere un atributo que defina qué imagen muestra. Este atributo se llama src. La <img>etiqueta no requiere una etiqueta de cierre, sin embargo, termina de manera diferente. En lugar de la etiqueta de cierre habitual, una <img>etiqueta se cierra terminando la etiqueta de apertura con un espacio y luego />. Por ejemplo:

    <img src="logo.jpg"/>
    <a> Define un enlace. Esta etiqueta requiere un atributo que defina a dónde va el enlace. Este atributo se llama href.
    <u> Define una lista desordenada. Esto iniciará una lista con viñetas.
    <ol> Define una lista ordenada. Esto iniciará una lista numerada.
    <li> Define una línea en una lista. Esta etiqueta se aplica tanto a las listas desordenadas como a las ordenadas. Cuando comienzas una lista, debes usar <li>etiquetas para abrir y cerrar cada línea por separado. Consulte la Figura 4 para ver un ejemplo de cómo se ve una lista en HTML.
    Define una tabla. Esto iniciará una mesa.
    <tr> Define una fila de tabla. Esto iniciará una fila en una tabla. Debes tener una <tr>etiqueta para cada fila de una mesa.
    <td> Define una columna de tabla. Esto iniciará una columna en una fila de una tabla. Debe tener una nueva <td>etiqueta para cada columna de cada fila de la tabla. Consulte la Figura 5 para ver un ejemplo de cómo se ve una tabla en HTML.
    <br> Define un salto de línea. Esta etiqueta no requiere una etiqueta de cierre.
    <h1>- <h6> Define encabezamientos. Hay seis niveles de encabezado HTML: <h1><h2>,<h3>,<h4>,<h5>, y<h6>. Cada uno define encabezamientos de su orden especificado (<h1>siendo el encabezado de primer orden y <h6>el sexto orden).

    		Define un párrafo. Así es como se etiquetan la mayoría de las secciones de texto.

    Tabla\(\PageIndex{1}\): Etiquetas HTML comunes

    HTML Vista previa

    <ul>

    <li>Ítem 1</li>

    <li>Ítem 2</li>

    <li>Tema 3</li>

    </ul>
    • Ítem 1
    • Ítem 2
    • Tema 3

    <ol>

    <li>Ítem 1</li>

    <li>Ítem 2</li>

    <li>Tema 3</li>

    </ol>
    1. Ítem 1
    2. Ítem 2
    3. Tema 3

    Figura\(\PageIndex{2}\): Listas ordenadas y desordenadas

    HTML Vista previa

    <tr>

    <td>Caja 1</td>

    <td>Caja 2</td>

    <td>Caja 3</td>

    </tr>

    <tr>

    <td>Caja 4</td>

    <td>Caja 5</td>

    <td>Caja 6</td>

    </tr>

    </table>
    Caja 1 Caja 2 Caja 3
    Caja 4 Caja 5 Caja 6

    Figura\(\PageIndex{3}\): Tablas

    This page titled 9.3: Etiquetas Básicas is shared under a CC BY license and was authored, remixed, and/or curated by Tiffani Reardon, Tammy Powell, Jonathan Arnett, Monique Logan, & Cassie Race.