Corso Html, allineamento e paragrafi

In questa lezione ci concentreremo sullo studio dei paragrafi e del loro rispettivo allineamento. Per prima cosa è necessario dire che per paragrafo si intende una o più righe di testo, l’importante è che siano compresi, per delimitarli, tra i tag che regolano appunto i paragrafi.

In questa lezione ci concentreremo sullo studio dei paragrafi e del loro rispettivo allineamento. Per prima cosa è necessario dire che per paragrafo si intende una o più righe di testo, l'importante è che siano compresi, per delimitarli, tra i tag che regolano appunto i paragrafi.

 

Il tag che regola e determina un paragrafo è il tag p che, in collaborazione con il tag di chiusura, racchiude in se le definizioni del paragrafo compreso l’allineamento e l’andare a capo in un paragrafo molto lungo. L’allineamento è regolato dall’attributo align seguito dalle definizioni right, left e center. Quindi, per riassumere, la definizione di paragrafo è determinata dai tag

 

e

 e il suo allineamento è regolato dall’attributo align che può essere definito in right, left e center. Ma veniamo al nostro solito esempio per vedere la sintassi di questi nuovi tag:

 

Ecco il mio primo testo

In questo esempio abbiamo utilizzato solamente i tags p per definire il paragrafo. Vediamo ora, utilizzando ancora solamente p, come definire due paragrafi:

se io scrivessi il seguente testo

Ecco il mio primo testo Ecco il secondo testo

questo risulterebbe tutto su una linea, però se interrompessi in questo modo:

Ecco il mio primo testo

Ecco il secondo testo

dividerei il testo andando a capo nel punto preferito. In questo modo abbiamo creato due paragrafi ben distinti. Ora, utilizziamo align per fare delle prove di allineamento dei due paragrafi in esempio:

Ecco il mio primo testo

Ecco il mio secondo testo

In pratica il primo paragrafo lo abbiamo allineato a sinistra e il secondo a destra. Vediamo ora con tre paragrafi utilizzando i tre parametri di allineamento:

Ecco il mio primo testo

Ecco il mio secondo testo

Ecco il mio secondo testo

In pratica abbiamo scritto tre paragrafi, ognuno definito con il suo allineamento. Ora si pone una domanda lecita: se devo allineare i tre paragrafi tutti sulla sinistra o tutti sulla destra o ancora tutti al centro, per ogni tag p devo inserire la definizione di allineamento? La risposta è….no! Per questi casi, molto ricorrenti, viene in aiuto un nuovo tag chiamato div entro il quale possiamo inserire più paragrafi senza specificarne l’allineamento. In prativa il tag div racchiude in se la formattazione di più paragrafi. Ecco allora l’esempio per comprendere ciò che voglio intendere:

Ecco il mio primo testo

Ecco il mio secondo testo

Ecco il mio secondo testo

Come vedete non c’è alcuno bisogno di specificare per ogni paragrafo l’allineamento in quanto ci pensa il buon div. In questa lezione avete compreso ancora meglio che ogni singolo tag può contenere dei parametri di formattazione che lo rendono, da una semplice etichetta, uno strumento molto potente per la realizzazione e la visualizzazione di pagine web. A ogni singolo tag può essere abbinato un diverso parametro di configurazione rendendolo indipendente da gli altri tag che compongono il documento. Salvate l’esempio riportato sempre come index.html I tag da utilizzare per il testo sono principalmente due, uno per i titoli e uno per i paragrafi. Per i titoli viene utilizzato il tag hche seguito da un numero che va da 1 a 6 determina la dimensione del font e quindi l’enfasi del titolo. Ecco un esempio di utilizzo del tag H:

Ecco il mio primo testo

In questo modo, attribuendo il valore 1 al tag h abbiamo attribuito un valore per il nostro testo, trasformandolo in un titolo. Come già accennato i valori da attribuire al tag h sono in tutto 6 e non oltre, quindi avremo:

….

….

….

….

….
….

Chiaramente il numero 1 corrisponde alla grandezza maggiore, e il numero 6 a quella minore. Provate a scrivere l’esempio seguente e caricate la pagina sul vostro browser per rendervi conto delle differenze di dimensioni dei font:

Questo font è H1

Questo font è H2

Questo font è H3

Questo font è H4

Questo font è H5
Questo font è H6

 

 

 

Ecco il risultato che si ottiene:

Questo font è H1

Questo font è H2

Questo font è H3

Questo font è H4

Questo font è H5
Questo font è H6

Analizzato il tag per determinare la dimensione dei titoli, vediamo ora il tag che determina la dimensione dei paragrafi e di tutto quello che non sono titoli. Questa dimensione viene espressa in pixel che abbreviato si scrive pxl che non è altro, poi, che i parametro che specifica la dimensione dei font. Questo parametro viene completato con la dimensione numerica da attribuire al font stesso, quindi avremo 1pxl, 2pxl, 3pxl …e così via, con il tag font size che serve appunto a specificare la dimensione del font. Vediamo come esprimere in Html la dimensione in pxl:

font size=”7pxl”> Ecco il mio primo testo

Un po’ di elasticità non guasta, quindi possiamo anche omettere l’attributo pxl e il risultato sarà lo stesso. Come avete visto, il tag h, che utilizziamo per il titolo, lavora da solo, ovvero, racchiude il testo senza tante pretese. Il tag font size, invece, fa parte del comando che regola il font e v
a incluso appunto nel tag font face. RIPRODUZIONE RISERVATA

Se vuoi rimanere aggiornato su Corso Html, allineamento e paragrafi iscriviti alla nostra newsletter settimanale

Commenta per primo

Lascia un commento

L'indirizzo email non sarà pubblicato.


*