Etiquetas para saltos de línea y párrafo

Para indicar un salto de línea se utiliza la etiqueta <br>.

add
B@UNAM

Etiquetas para saltos de línea y párrafo

Cuando estamos elaborando una página web, y queremos escribir una párrafo extenso, o bien, que haya una separación entre párrafo y párrafo, HTML nos proporciona las etiquetas <br> y <p>.

Etiqueta <br>

La etiqueta <br> produce un salto de línea en el punto donde aparece y no es necesario que lleve su correspondiente etiqueta de cierre </br>. Cuando el navegador encuentra una etiqueta <br> crea un salto de línea continuando el texto que exista después de esa etiqueta alineado al margen izquierdo, sin producir espacio adicional por arriba o por debajo de la nueva línea, lo único que hace es continuar con el texto en la siguiente línea.

<h4> Seleccionar primero los datos a graficar, incluyendo los títulos <br> para que se integren automáticamente en la gráfica </br></h4>

<br> puede también usarse dentro de otros elementos como párrafos y elementos de una lista.

Etiqueta <p>

Para indicar un salto de línea se utiliza la etiqueta <br>, y para un cambio de párrafo (dejar una línea en blanco en medio) se utiliza la etiqueta<p>.

La etiqueta <p> puede usarse también como etiqueta "cerrada" <p> y </p> para indicar los atributos de un párrafo en concreto. Cuando se usa de esta manera tiene el parámetro align, que aprendiste para la “Alineación de elementos individuales”.

<h4><p> Seleccionar primero los datos a graficar, incluyendo los títulos para que se integren automáticamente en la gráfica </p> </h4>

Etiquetas para formato de caracteres y párrafos

Los textos de las páginas web pueden tener formatos o estilos en su presentación. Es posible definir de una manera inmediata algunas de estas características, como las negritas, itálicas, etc., para ello debes usar los siguientes pares de etiquetas:

<b> … </b>Texto en negritas
<em> … </em>Texto enfatizado
<i> … </i>Texto en cursivas
<strong> … </ strong > Texto en tipo fuerte
<u> … </u>Subrayado

Es importante señalar que el tipo de letra y su tamaño también puede editarse con el par de etiquetas <font> … </font> y sus correspondientes atributos:

  • data_usage face

    Toma como valor un conjunto de nombres de tipos de letra, escritos entre comillas y separados por comas.

    Sintaxis: <font face=”Arial, helvetica”>Texto a definir</font>

    Generalmente, el navegador busca los tipos de letra indicados uno a la vez (p. ej “Arial, helvetica”). Si no encuentra el primero, busca el segundo, después el tercero y así sucesivamente hasta encontrar un tipo de letra que esté instalado en el sistema; y si no encuentra ninguno de los tipos de letra indicados, entonces usa el predeterminado por el navegador (Times New Roman).

  • data_usage size
    Determina el tamaño de la letra del texto. Los valores que pueden utilizarse de forma creciente van del 1 al 7.
  • data_usage color

    Determina el color de las letras del texto. Puedes utilizar la tabla de colores vista en las etiquetas Uso de los colores.

    Es importante considerar que al escribir los textos (o párrafos) junto con sus atributos (tipo de letra, tamaño y color), es conveniente indicar los inicios de cada párrafo con la etiqueta <p></p>.

Autoevaluación

Observa cómo se insertan las etiquetas de salto de línea y párrafo y el formato de caracteres en la estructura básica de la página web y su visualización con el navegador.

Sigue los pasos que a continuación se indican para que diseñes tu primera página web.

  1. Crea una carpeta con el nombre paginasweb en el directorio raíz de tu computadora para que allí guardes todas las páginas web que elabores.

  2. Accede al bloc de notas, desde el escritorio de la pantalla de tu computadora, en la parte inferior izquierda, escribe bloc de notas y da clic.

  3. Al abrir el Bloc de notas se despliega su pantalla con el cursor vertical parpadeando, en espera de que escribas las etiquetas correspondientes a tu primera página Web:

  4. Escribe el siguiente código:

  5. Guarda o salva en tu carpeta paginasweb el código que acabas de escribir con el nombre saltodelinea.html siguiendo la ruta establecida en el bloc de notas: Archivo/Guardar como, como se indica en la siguiente pantalla:

    Nota: es importante recordar que los nombres de archivos deben escribirse con minúsculas, sin acentos, sin espacios en blanco, sin caracteres especiales y siempre asigna manualmente la extensión html para que el navegador Web pueda reconocer al archivo como página Web.

  6. Ahora accede al contenido de la carpeta paginasweb y podrás ver que el archivo saltodelinea.html que acabas de salvar tiene asociado el icono del explorador que hayas predefinido como principal (Netscape, Firefox, Explorer, etc.). Esto significa que el navegador Web ya lo puede reconocer.

  7. Haz doble clic en el archivo saltodelinea.html y observa cómo el navegador despliega el mensaje:

  8. Escribe el siguiente código:

  9. Guarda o salva en tu carpeta paginasweb el código que acabas de escribir con el nombre caracteres.html siguiendo la ruta establecida en el bloc de notas: Archivo/Guardar como, como se indica en la siguiente pantalla:

    Nota: es importante recordar que los nombres de archivos deben escribirse con minúsculas, sin acentos, sin espacios en blanco, sin caracteres especiales y siempre asigna manualmente la extensión html para que el navegador Web pueda reconocer al archivo como página Web.

  10. Ahora accede al contenido de la carpeta paginasweb y podrás ver que el archivo caracteres.html que acabas de salvar tiene asociado el icono del explorador que hayas predefinido como principal (Netscape, Firefox, Explorer, etc.). Esto significa que el navegador Web ya lo puede reconocer.

  11. Haz doble clic en el archivo caracteres.html y observa cómo el navegador despliega el mensaje:

  12. Ahora, cierra el navegador haciendo clic en el icono localizado en el ángulo superior derecho de la pantalla.

menu