Html pre etiqueta

Las etiquetas de formato de texto HTML abarcan un rango muy amplio. Una etiqueta de formato de texto importante en HTML se conoce como la etiqueta "pre". Esta etiqueta se usa para mostrar texto en una página web al igual que está escrita dentro del script HTML. Significa que su script HTML o su navegador no formatearán su texto por sí solo; más bien, preservará el formato que ha mantenido mientras escribe el guión. Al pasar por esta guía, aprenderá a usar la etiqueta previa en html.

Uso de la etiqueta previa en html:

Para usar la etiqueta previa en HTML, puede considerar los siguientes tres ejemplos:

Ejemplo # 1: Mostrar algún texto aleatorio pre-formateado en una página web:

En este ejemplo, tenemos la intención de mostrar un texto aleatorio preformado en una página web haciendo uso de la etiqueta previa de HTML. El script HTML que hemos escrito para este propósito se muestra en la imagen a continuación:

En este script HTML, hemos utilizado la etiqueta "pre" para encerrar un párrafo aleatorio en él. Puede ver que este párrafo contiene espacios y saltos de línea en lugares aleatorios. Nuestro objetivo es hacer que este texto aparezca como está en la página web. Esta es exactamente la razón por la que hemos utilizado la etiqueta pre html.

Cuando ejecutamos el script HTML que se muestra arriba con el navegador Google Chrome, nuestro texto apareció exactamente como está en la página web, como puede ver desde la siguiente imagen. Significa que el formato de este texto, yo.mi., Los espacios aleatorios y las roturas de línea se han conservado muy bien debido al uso de la etiqueta pre html.

Ejemplo # 2: Mostrar una imagen en una página web:

En el segundo ejemplo, iremos un paso más allá e intentaremos dibujar una imagen haciendo uso de la etiqueta pre html. Tenemos la intención de mostrar una vaca en nuestra página web, debido a la cual hemos utilizado el script HTML que se muestra a continuación:

En este ejemplo, hemos dibujado una vaca en nuestro script HTML usando diferentes símbolos. Queríamos preservar el formato de este dibujo porque lo hemos encerrado dentro de la etiqueta previa de HTML.

Cuando ejecutamos este script HTML, nuestro sorteo apareció como está en la página web como se muestra en la siguiente imagen:

Ejemplo # 3: Mostrar una imagen sin la etiqueta previa en HTML en una página web:

En este ejemplo, modificaremos ligeramente nuestro segundo script para ver el efecto de eliminar la etiqueta previa de ese script html. Esto se muestra en la imagen a continuación:

Cuando ejecutamos el mismo script con el navegador Google Chrome después de eliminar la etiqueta HTML pre, el formato de nuestro dibujo se endureció y solo pudimos ver algunos símbolos dispersos en la página web, como se muestra en la siguiente imagen. Esto resalta la importancia de usar la etiqueta pre en HTML.

Conclusión:

Este artículo estaba destinado a proporcionarle una comprensión profunda de la etiqueta previa en HTML. Para transmitir este concepto correctamente, compartimos con usted tres ejemplos detallados que utilizan esta etiqueta HTML. Una vez que pase por estos ejemplos, aprenderá rápidamente a usar esta etiqueta en HTML.