Què és el text preformatat?

Aquí, com s'utilitza l'etiqueta de text preformat en el vostre codi HTML

Quan afegiu text al codi HTML d'una pàgina web, digueu-lo en un element de paràgraf, teniu poc o cap control sobre on es trencaran aquestes línies de text o l'espaiat que s'utilitzarà. Això és degut a que el navegador web farà que el text sigui necessari en funció de l'àrea que la conté. Això inclou llocs web responsables que tindran un disseny molt fluid que canvia segons la mida de la pantalla que s'utilitza per veure la pàgina .

El text HTML trencarà una línia on necessita una vegada que ha arribat al final de la seva àrea de contingut. Al final, el navegador juga més d'un paper a l'hora de determinar com es trenca el text del que feu.

Pel que fa a l'addició d'espais per crear un determinat format o disseny, HTML no reconeix l'espaiat que s'afegeix al codi, incloent la barra espaiadora, la pestanya o el retorn de carro. Si col·loca vint espais entre una paraula i la paraula que ve després, el navegador només mostrarà un sol espai. Això es coneix com a col.lapse d'espais en blanc i en realitat és un dels conceptes d'HTML que molts dels nous a la indústria lluiten al principi. Esperen que l'espai en blanc d'HTML funcioni de la mateixa manera que en un programa com Microsoft Word, però això no és el que funciona en blanc en blanc.

En la majoria dels casos, el maneig normal del text en qualsevol document HTML és exactament el que necessiteu, però en altres casos, és possible que vulgueu més control sobre exactament com surten els espais de text i on trenca les línies.

Això es coneix com text pre formatat (en altres paraules, dicteu el format). Podeu afegir text pre formatat a les vostres pàgines web mitjançant l'etiqueta pre prefixada HTML.

Utilitzant l'etiqueta

Fa molts anys, solia ser comú veure pàgines web amb blocs de text preformatats. L'ús de l'etiqueta predefinida per definir seccions de la pàgina com a format per la tipificació en si mateix era una manera ràpida i senzilla perquè els dissenyadors web obtinguessin el text perquè volguessin.

Això era abans de l'augment de CSS per al disseny, quan els dissenyadors web eren realment atrapats intentant forçar el disseny mitjançant l'ús de taules i altres mètodes de només HTML. Això (poc) ha funcionat perquè el text amb format predefinit es defineix com un text en què l'estructura està definida per convencions tipogràfiques més que per la representació HTML.

Avui, aquesta etiqueta no s'utilitza tant perquè CSS ens permet dictar estils visuals de manera molt més eficient que intentar forçar l'aparició en el nostre HTML i perquè els estàndards web dicten una clara separació de l'estructura (HTML) i els estils (CSS). Tot i així, és possible que hi hagi moments en què el text preformat tingui sentit, com per a una adreça postal on voleu forçar els salts de línia o per a exemples de poesia, on els salts de línia són essencials per a la lectura i el flux general del contingut.

Aquí teniu una forma d'utilitzar l'etiqueta HTML

: 

 
 Twas brillig i les toves slithey Did gyre i gimble in the wabe  
 L'HTML típic col·lapsa l'espai en blanc del document. Això vol dir que el retorn del carro, els espais i els caràcters de tabulació usats en aquest text es colapsaran en un sol espai. Si heu escrit el quote anterior en una etiqueta HTML típica com l'etiqueta p (paràgraf), acabaria amb una línia de text, com aquesta: 
 Twas brillig i les toves slithey Vaig fer gimnàstica i gimnàstica al wabe 
 L'etiqueta pre deixa els caràcters de l'espai blanc com és. Així, els salts de línia, espais i pestanyes es mantenen en la representació d'aquest contingut per part del navegador. Posar la cita dins d'una etiqueta pre per aquest mateix text resultaria en aquesta visualització: 
 Twas brillig i les toves slithey Vaig fer gimnàstica i gimnàstica al wabe 
 Quant a fonts 
 L'etiqueta preal fa més que mantenir els espais i trencaments del text que escriviu. En la majoria de navegadors, està escrit en una font de monoespai. Això fa que els caràcters del text siguin iguals en amplada. En altres paraules, la lletra ocupa tant espai com la lletra w. 
 Si preferiu utilitzar un altre tipus de lletra en comptes d'un monospace predeterminat que mostri el navegador, podeu canviar-lo amb fulls d'estil i seleccionar qualsevol altra font que vulgueu que es reprodueixi el text . 
 HTML5 
 Una cosa a tenir en compte és que, en HTML5, l'atribut "width" ja no és compatible amb l'element 
. A l'HTML 4.01, l'amplada especificava la quantitat de caràcters que contindria una línia, però això s'ha reduït per HTML5 i més enllà. 

 Editat per Jeremy Girard el 2/2/17