CodeGym /Curso de Java /Frontend SELF ES /Formateo del documento

Formateo del documento

Frontend SELF ES
Nivel 2 , Lección 2
Disponible

1. Formateo de texto

Sigamos estudiando HTML...

Párrafos (p)

El tag <p> se usa para crear párrafos de texto. Los párrafos ayudan a dividir el texto en bloques lógicos, mejorando la legibilidad y la percepción de la información.

Ejemplo:

HTML
      
<p>Este es el primer párrafo de texto. Contiene cierta cantidad de información.</p>
<p>Este es el segundo párrafo de texto. Está separado del primer párrafo.</p>
      
    

Texto negrita (b)

El tag <b> se usa para resaltar texto en negrita (bold). Esto permite enfatizar la importancia de ciertas palabras o frases.

HTML
      
<p>Este es un texto <b>importante</b>.</p>
      
    

Texto en cursiva (i)

El tag <i> se usa para resaltar texto en cursiva (letra inclinada, italic). A menudo se utiliza para designar términos, títulos de libros, palabras extranjeras, etc.

Ejemplo:

HTML
      
<p>Este es un <i>término</i> resaltado en cursiva.</p>
      
    

2. Encabezados (h1 - h6)

Los encabezados en HTML se usan para estructurar el contenido y crear una jerarquía de encabezados en la página. Existen seis niveles de encabezados, donde <h1> es el más importante y <h6> el menos importante.

  • <h1> — El encabezado más importante y grande. Generalmente se usa como el encabezado principal de la página.
  • <h2> — Se usa para subtítulos que siguen a <h1>.
  • <h3> — Nivel de encabezado más bajo que <h2>.
  • <h4> — Nivel de encabezado más bajo que <h3>.
  • <h5> — Nivel de encabezado más bajo que <h4>.
  • <h6> — El encabezado más pequeño y menos relevante.

Ejemplo:

HTML
      
<h1>Encabezado principal de la página</h1>
<h2>Subtítulo de nivel 2</h2>
<h3>Subtítulo de nivel 3,</h3>
      
    

3. Etiquetas adicionales en el documento head

Hay etiquetas que podrías encontrar en el futuro en ejemplos de HTML, quiero hablar brevemente de ellas:

1. Etiqueta <title>

La etiqueta <title> define el nombre de la página que se muestra en la pestaña del navegador. Es lo primero que ve el usuario al abrir la página. Casi siempre está presente en todas las páginas. Por defecto es agregado por el editor de HTML, pero para proyectos educativos no tiene mucho valor.

2. Etiqueta <meta charset="UTF-8">

La etiqueta <meta> dentro de <head> define la codificación de caracteres para el documento. UTF-8 es la codificación más común, que soporta la mayoría de los idiomas del mundo. Hablaremos sobre las codificaciones más adelante.

3. Etiqueta <meta name="viewport" content="width=device-width, initial-scale=1.0">

Esta etiqueta también se encuentra dentro de <head>. Asegura una correcta visualización de la página en dispositivos móviles. Define el ancho del área de visualización (viewport) igual al ancho de la pantalla del dispositivo y el escalado inicial de la página.

4. Etiqueta <link rel="stylesheet" href="styles.css">

La etiqueta <link/> conecta un archivo CSS externo para estilizar la página. El atributo rel="stylesheet" indica que es una hoja de estilos, y href="styles.css" define la ruta al archivo de estilos.

5. Etiqueta <script src="script.js" defer></script>

La etiqueta <script> conecta un archivo JavaScript externo para añadir interactividad a la página. El atributo src define la ruta al archivo del script, y defer indica al navegador que el script debe ejecutarse después de que se cargue el documento HTML.

Comentarios
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION