¿Que é o texto preformado?

Vexa como usar a etiqueta de texto preformado no seu código HTML

Cando engada texto ao código HTML dunha páxina web, digamos nun elemento de parágrafo, ten pouco ou ningún control sobre onde se romperán esas liñas de texto ou o espazamento que se usará. Isto débese a que o navegador web enviará o texto segundo o necesario en función da área que o contén. Isto inclúe sitios web sensibles que terán un deseño moi fluído que se cambiará segundo o tamaño da pantalla que se utilice para ver a páxina .

O texto HTML romperá unha liña onde precisa unha vez que chegou ao final da súa área de contido. Ao final, o navegador xoga un papel máis importante para determinar o xeito no que se rompe o texto que o que fas.

En termos de engadir espazos para crear un determinado formato ou deseño, o HTML non recoñece o espazamento que se engade ao código, incluída a barra espaciadora, a lapela ou as voltas de carro. Se pon vinte espazos entre unha palabra ea palabra que aparece despois, o navegador fará só un só espazo alí. Isto é coñecido como colapso do espazo branco e en realidade é un dos conceptos de HTML que moitos novos enfrontan á industria ao principio. Eles esperan que o espazo en branco HTML funcione do xeito que o faga nun programa como Microsoft Word, pero iso non é o que funciona en branco en branco.

Na maioría dos casos, a manipulación normal do texto en calquera documento HTML é exactamente o que precisa, pero noutros casos, pode realmente querer máis control sobre exactamente como saen os espazos de texto e onde rompe as liñas.

Isto é coñecido como texto preformado (noutras palabras, vostede dita o formato). Pode engadir texto preformado ás túas páxinas web usando a etiqueta pre preliminar de HTML.

Usando a etiqueta

Fai moitos anos, era común ver páxinas web con bloques de texto preformulado. Usando a etiqueta pre para definir seccións da páxina como formateadas polo teclado en si foi un xeito rápido e sinxelo para que os deseñadores web poidan mostrar o texto como quixeron.

Isto foi antes do incremento de CSS para o deseño, cando os diseñadores web estaban realmente atrapados intentando forzar o deseño empregando táboas e outros métodos só en HTML. Isto (algo) funcionou porque o texto preformulado defínese como un texto no que a estrutura defínese polas convencións tipográficas e non pola representación HTML.

Hoxe, esta etiqueta non se usa tanto porque CSS permítenos dictar estilos visuais de xeito moito máis eficiente que intentar forzar a aparencia no noso HTML e porque os estándares web dictan unha clara separación de estrutura (HTML) e estilos (CSS). Aínda así, pode haber casos nos que o texto preformado ten sentido, como por un enderezo de correo onde quere forzar os saltos de liña ou exemplos de poesía onde os saltos de liña son esenciais para a lectura e o fluxo xeral do contido.

Aquí ten unha forma de usar a etiqueta HTML

: 

 
 Twas brillig e os toves slithey fixeron gyre e gimble no wabe  
 O HTML típico colapsa o espazo en branco do documento. Isto significa que os caracteres de retorno de carro, espazos e tabulacións empregados neste texto se colapsarán nun espazo. Se escribiu a cita anterior nunha etiqueta HTML típica como a etiqueta p (parágrafo), acabarías cunha liña de texto, así: 
 Twas brillig e os toves slithey fixeron gyre e gimple no wabe 
 A etiqueta pre deixa os caracteres do espazo branco como está. Polo tanto, os saltos de liña, espazos e pestanas mantéñense na representación do navegador deste contido. Poñer a cita dentro dunha etiqueta pre para ese mesmo texto resultaría nesta pantalla: 
 Twas brillig e os toves slithey fixeron gyre e gimple no wabe 
 Respecto ás fontes 
 A pre etiqueta fai máis que manter os espazos e os saltos para o texto que escribes. Na maioría dos navegadores, está escrito nunha fonte monospace. Isto fai que todos os caracteres do texto sexan iguais. Noutras palabras, a letra que ocupa tanto espazo como a letra w. 
 Se preferirías usar outra fonte no lugar do espazo monospace predeterminado que mostre o navegador, aínda podes cambiar isto con follas de estilo e seleccionar calquera outra fonte na que che gustaría que o texto se reproduza . 
 HTML5 
 Unha cousa a ter en conta é que, en HTML5, o atributo "ancho" xa non é compatible co elemento 
. No HTML 4.01, o ancho especificaba o número de caracteres que contaría unha liña, pero este foi eliminado para HTML5 e máis aló. 

 Editado por Jeremy Girard o 2/2/17