In questa seconda parte, verranno affrontate altre tematiche inerenti l'aspetto tipografico applicato alle pagine web, controllato attraverso i CSS.
La proprietà font-style
La proprietà font-style controlla l' attribuzione dello stile corsivo (italic). La dichiarazine font-style: italic cerca di usare la variante "corsivo" del set dei caratteri specificato dal font-family. Se non lo trova, sceglierà un carattere obliquo, che verrà creato, se non è già presente. La dichiarazione font-style: oblique darà un carattere corsivo vero o ne creerà uno obliquo. Infine la dichiarazione font-style: normal cancellerà ogni corsivo attualmente in uso e darà un carattere dritto.
Decorazione del testo (text-decoration)
La proprietà text-decoration permette di decorare il testo con delle sottolineature; accetta i seguenti valori:
none | underline | overline | line-through
Si possono usare più combinazioni di valori in una dichiarazione per avere più decorazioni contemporaneamente. Comunque fare attenzione a non combinare insieme il valore none con altri più su elencati, in quanto sarebbero resi nulli. Ecco un esempio di un file "html" con queste quattro proprietà.
Controllare le interruzioni di riga
Per controllare le interruzioni di riga ci sono diversi modi; il primo è la lunghezza, il secondo è l' uso del tag <br/ > per provocare una interruzione forzata e il terzo consiste nel far rispettare al browser il punto in cui il webmaster ha inserito nel codice delle interruzioni, ad esempio con i blocchi <pre>.
La proprietà dei CSS white-space controlla come il browser si comporta con gli spazi bianchi (spazi, tab, e ritorni di riga) inseriti nel codice. L' impostazione predefinita normal, fa si che il browser ignori gli spazi bianchi: anche se sono stati lasciati molti "a capo" in un testo, si vedranno tutti i caratteri su una unica riga. Gli altri due valori di white-space, cioè pre e no-wrap, si comportano rispettivamente in modo che il browser rispetti i caratteri bianchi che si trovano nel codice. Ecco a tal proposito un esempio.
Elenchi
Lo scopo di un elenco è molto semplice: presentare a video, nel caso di una pagina web, una serie di elementi. Formattare un elenco, tuttavia, presenta qualche problema. Si deve decidere come separare le voci, se usare dei simboli visivi al posto di quelli di default e come rendere differente l'elenco dal testo che lo circonda. I marcatori per creare elenchi sono due: <ol> e <ul>.
È possibile posizionare il marcatore all'interno del flusso dei contenuti generato dall'elenco di voci, oppure possiamo posizionarla al di fuori. Vediamo un esempio.
Quando il marcatore è posto fuori dalla gabbia dell'elenco delle voci, non ha alcun effetto sull'impaginato. Se, invece, le voci sono allineate al filo del margine sinistro della pagina, il marcatore non sarà visibile da quel lato. Se il marcatore è posto al di fuori della gabbia dell'elenco, è possibile allineare il margine sinistro delle voci (non il marcatore) con il margine sinistro del testo circostante. Le voci degli elenchi sono indentate di default. Ecco un esempio con questi casi. Le proprietà che si applicano agli elenchi sono: list-style-type e list-style-position. Controllano il tipo di marcatore usato dall'elenco e se il marcatore deve stare fuori dalla gabbia delle voci.