Stili di testo in HTML5

Sommario

Gli stili di base più utilizzati sono l'allineamento del testo e la giustificazione, questo ci aiuta a localizzare il testo e renderlo più compatibile con l'ambiente, immaginiamo che dobbiamo inserire un riassunto di una notizia e vogliamo che si distingua da un altro testo, potremmo fare in modo che il suo allineamento sia focalizzato in modo da ottenere il risalto che volevamo all'inizio.
Per ottenere ciò utilizzeremo due proprietà:

1. Allineamento del testo: Specifica che l'allineamento di un blocco di testo può assumere i valori: inizio, fine, sinistra, destra, centro, giustificazione.

2. giustificare il testo: Specifica la tecnica che verrà utilizzata per giustificare il testo quando si sceglie giustificato in text-align.

Vediamo un po' di codice dove applichiamo questo:
 Esempio

Ci sono molti tipi diversi di frutta - ci sono oltre 500 varietà di banane da sole. Quando aggiungiamo gli innumerevoli tipi di mele, arance e altri frutti ben noti, ci troviamo di fronte a migliaia di scelte. Uno degli aspetti più interessanti della frutta è la varietà disponibile in ogni paese. Vivo vicino a Londra, in una zona nota per le sue mele.

Inizio Fine Sinistra Destra Giustifica Centro


In questa porzione di codice ciò che abbiamo fatto è creare un sceneggiatura con la lingua Javascript che ci permette di cambiare l'attributo di allineare il testo in modo che quando lo eseguiamo nel nostro browser possiamo vedere la differenza tra ciascuno dei valori delle proprietà dell'attributo. Vediamo come abbiamo un paio di queste proprietà applicate nel browser:

INGRANDIRE

Qui possiamo notare che la schermata di sinistra che abbiamo applicato centro che ci permette di centrare il testo e sulla schermata di destra abbiamo applicato Giusto che ci dà la possibilità di allineare il testo a destra.
Vediamo ora un'altra delle caratteristiche di HTML5 quando un testo ha spazi vuoti, doppi o tripli, il browser di solito li sostituisce con uno spazio singolo, come le righe vuote, le ignora, per lavorarci abbiamo la proprietà spazi bianchi, può assumere i seguenti attributi:
  • normale: È il valore predefinito nel browser, ignora più spazi e nuove righe.
  • ora rap: In questo caso gli spazi vengono ignorati ma vengono rispettate le interruzioni di riga.
  • pre: Vengono mantenuti gli spazi bianchi e solo le interruzioni di riga.
  • pre-line: lo spazio viene ignorato, ma l'interruzione di riga viene rispettata.
  • pre-incarto: La spaziatura bianca è rispettata e ci sarà un'interruzione di riga quando specificato o quando richiesto dal blocco.

Vediamo un esempio:
 Esempio

Ci sono molti tipi diversi di frutta - ci sono oltre 500 varietà di banane da sole. Quando aggiungiamo gli innumerevoli tipi di mele, arance e altri frutti ben noti, ci troviamo di fronte a migliaia di scelte. Uno degli aspetti più interessanti della frutta è la varietà disponibile in ogni paese. Vivo vicino a Londra, in una zona nota per le sue mele.


Come possiamo vedere abbiamo incluso più doppi spazi nel testo e abbiamo indicato che utilizzeremo la proprietà pre-fila, Vediamo cosa ci mostrerà il browser:

Come possiamo vedere, ha rispettato solo le interruzioni di riga, tuttavia gli spazi vuoti sono stati modificati in spazi semplici.

Aiuterete lo sviluppo del sito, condividere la pagina con i tuoi amici

wave wave wave wave wave