" o "
" e' completamente indifferente.
Per allineare al centro è possibile scrivere anche:
Testo allineato al centro
e si otterrà:
Testo allineato al centro
ma come abbiamo detto, questo Tag è obsoleto anche se ancora supportato, quindi se ne sconsiglia l'utilizzo.
Per giustificare un paragrafo di un lungo testo si usano le stesse istruzioni sopra descritte, in questo caso useremo per praticità il Tag "
", il codice è il seguente:
SINISTRA Quid autem prius vox primi loquentis sonaverit, viro sane mentis in promptu esse non titubo ipsum fuisse quod ‘Deus’ est, scilicet El, vel per modum interrogationis vel per modum responsionis. Absurdum atque rationi videtur orrificum ante Deum ab homine quicquam nominatum fuisse, cum ab ipso et in ipsum factus fuisset homo. Nam sicut post prevaricationem humani generis quilibet exordium sue locutionis incipit ab ‘heu’, rationabile est quod ante qui fuit inciperet a gaudio; et cum nullum gaudium sit extra Deum, sed totum in Deo, et ipse Deus totus sit gaudium, consequens est quod primus loquens primo et ante omnia dixisset ‘Deus’.
DESTRA Quid autem prius vox primi loquentis sonaverit, viro sane mentis in promptu esse non titubo ipsum fuisse quod ‘Deus’ est, scilicet El, vel per modum interrogationis vel per modum responsionis. Absurdum atque rationi videtur orrificum ante Deum ab homine quicquam nominatum fuisse, cum ab ipso et in ipsum factus fuisset homo. Nam sicut post prevaricationem humani generis quilibet exordium sue locutionis incipit ab ‘heu’, rationabile est quod ante qui fuit inciperet a gaudio; et cum nullum gaudium sit extra Deum, sed totum in Deo, et ipse Deus totus sit gaudium, consequens est quod primus loquens primo et ante omnia dixisset ‘Deus’.
CENTRATO Quid autem prius vox primi loquentis sonaverit, viro sane mentis in promptu esse non titubo ipsum fuisse quod ‘Deus’ est, scilicet El, vel per modum interrogationis vel per modum responsionis. Absurdum atque rationi videtur orrificum ante Deum ab homine quicquam nominatum fuisse, cum ab ipso et in ipsum factus fuisset homo. Nam sicut post prevaricationem humani generis quilibet exordium sue locutionis incipit ab ‘heu’, rationabile est quod ante qui fuit inciperet a gaudio; et cum nullum gaudium sit extra Deum, sed totum in Deo, et ipse Deus totus sit gaudium, consequens est quod primus loquens primo et ante omnia dixisset ‘Deus’.
GIUSTIFICATO Quid autem prius vox primi loquentis sonaverit, viro sane mentis in promptu esse non titubo ipsum fuisse quod ‘Deus’ est, scilicet El, vel per modum interrogationis vel per modum responsionis. Absurdum atque rationi videtur orrificum ante Deum ab homine quicquam nominatum fuisse, cum ab ipso et in ipsum factus fuisset homo. Nam sicut post prevaricationem humani generis quilibet exordium sue locutionis incipit ab ‘heu’, rationabile est quod ante qui fuit inciperet a gaudio; et cum nullum gaudium sit extra Deum, sed totum in Deo, et ipse Deus totus sit gaudium, consequens est quod primus loquens primo et ante omnia dixisset ‘Deus’.
Se scriviamo questo codice in unfile HTML, salviamo e visualizziamo, il risultato sarà il seguente:
SINISTRA Quid autem prius vox primi loquentis sonaverit, viro sane mentis in promptu esse non titubo ipsum fuisse quod ‘Deus’ est, scilicet El, vel per modum interrogationis vel per modum responsionis. Absurdum atque rationi videtur orrificum ante Deum ab homine quicquam nominatum fuisse, cum ab ipso et in ipsum factus fuisset homo. Nam sicut post prevaricationem humani generis quilibet exordium sue locutionis incipit ab ‘heu’, rationabile est quod ante qui fuit inciperet a gaudio; et cum nullum gaudium sit extra Deum, sed totum in Deo, et ipse Deus totus sit gaudium, consequens est quod primus loquens primo et ante omnia dixisset ‘Deus’.
DESTRA Quid autem prius vox primi loquentis sonaverit, viro sane mentis in promptu esse non titubo ipsum fuisse quod ‘Deus’ est, scilicet El, vel per modum interrogationis vel per modum responsionis. Absurdum atque rationi videtur orrificum ante Deum ab homine quicquam nominatum fuisse, cum ab ipso et in ipsum factus fuisset homo. Nam sicut post prevaricationem humani generis quilibet exordium sue locutionis incipit ab ‘heu’, rationabile est quod ante qui fuit inciperet a gaudio; et cum nullum gaudium sit extra Deum, sed totum in Deo, et ipse Deus totus sit gaudium, consequens est quod primus loquens primo et ante omnia dixisset ‘Deus’.
CENTRATO Quid autem prius vox primi loquentis sonaverit, viro sane mentis in promptu esse non titubo ipsum fuisse quod ‘Deus’ est, scilicet El, vel per modum interrogationis vel per modum responsionis. Absurdum atque rationi videtur orrificum ante Deum ab homine quicquam nominatum fuisse, cum ab ipso et in ipsum factus fuisset homo. Nam sicut post prevaricationem humani generis quilibet exordium sue locutionis incipit ab ‘heu’, rationabile est quod ante qui fuit inciperet a gaudio; et cum nullum gaudium sit extra Deum, sed totum in Deo, et ipse Deus totus sit gaudium, consequens est quod primus loquens primo et ante omnia dixisset ‘Deus’.
GIUSTIFICATO Quid autem prius vox primi loquentis sonaverit, viro sane mentis in promptu esse non titubo ipsum fuisse quod ‘Deus’ est, scilicet El, vel per modum interrogationis vel per modum responsionis. Absurdum atque rationi videtur orrificum ante Deum ab homine quicquam nominatum fuisse, cum ab ipso et in ipsum factus fuisset homo. Nam sicut post prevaricationem humani generis quilibet exordium sue locutionis incipit ab ‘heu’, rationabile est quod ante qui fuit inciperet a gaudio; et cum nullum gaudium sit extra Deum, sed totum in Deo, et ipse Deus totus sit gaudium, consequens est quod primus loquens primo et ante omnia dixisset ‘Deus’.
6) elenchi puntati
In HTML ci sono molti tipi di elenchi puntati e numerati in diverse maniere, i Tag per ottenere questo sono: "
...- ...
", dove "
" si mette all'inizio dell'elenco, "- " si mette davanti ad ogni nuova voce e "
" si mette alla fine dell'elenco puntato, nel caso di elenchi numerati. Nel caso di elenchi puntati senza alcun tipo di ordinazione al posto di "ol" si mette "ul".
Elenchi numerati
Gli elenchi numerati sono quelli in cui all'inizio è presente una numerazione o un'ordinazione con lettere o numeri romani; vediamo alcuni esempi:
con il codice:
- Voce numero 1.
- Voce numero 2.
- Voce numero 3.
si ottiene un elenco numerato con numeri:
Voce numero 1.
Voce numero 2.
Voce numero 3.
con il codice:
- Voce numero 1.
- Voce numero 2.
- Voce numero 3.
si ottiene un elenco ordinato con lettere maiuscole:
Voce numero 1.
Voce numero 2.
Voce numero 3.
con il codice:
- Voce numero 1.
- Voce numero 2.
- Voce numero 3.
si ottiene un elenco ordinato con lettere minuscole:
Voce numero 1.
Voce numero 2.
Voce numero 3.
con il codice:
- Voce numero 1.
- Voce numero 2.
- Voce numero 3.
si ottiene un elenco ordinato con numeri romani maiuscoli:
Voce numero 1.
Voce numero 2.
Voce numero 3.
con il codice:
- Voce numero 1.
- Voce numero 2.
- Voce numero 3.
si ottiene un elenco ordinato con numeri romani minuscoli:
Voce numero 1.
Voce numero 2.
Voce numero 3.
Elenchi puntati non numerati
Questo tipo di elenchi sono, come dice il titoletto, solamente puntati e non hanno un ordinazione di alcun tipo, possiamo però scegliere il tipo di punto che verrà messo ad ogni voce, ma vediamo alcuni esempi:
Con il codice:
- Voce numero 1.
- Voce numero 2.
- Voce numero 3.
si otterrà:
Voce numero 1.
Voce numero 2.
Voce numero 3.
Con il codice:
- Voce numero 1.
- Voce numero 2.
- Voce numero 3.
si otterrà:
Voce numero 1.
Voce numero 2.
Voce numero 3.
Con il codice:
- Voce numero 1.
- Voce numero 2.
- Voce numero 3.
si otterrà:
Voce numero 1.
Voce numero 2.
Voce numero 3.
Elenchi puntati e numerati nidificati.
E' ovviamente possibile creare elenchi puntati che contengono elenchi numerati che a loro volta ne contengono altri e cosi' via, per esempio il codice:
- Voce numero 1.
- Voce numero 2.
- Voce numero 1.
- Voce numero 2.
- Voce numero 1.
- Voce numero 1.
- Voce numero 2.
- Voce numero 2.
- Voce numero 3.
- Voce numero 3.
- Voce numero 3.
genera il seguente risultato:
Voce numero 1.
Voce numero 2.
Voce numero 1.
Voce numero 2.
Voce numero 1.
Voce numero 1.
Voce numero 2.
Voce numero 2.
Voce numero 3.
Voce numero 3.
Voce numero 3.
7) inserimento e uso delle imaginozze
Per inserire un'immagine in un qualunque punto della pagina web si utilizza il seguente Tag: "
", il suo utilizzo è alquanto semplice, infatti se utilizziamo il codice:
otterremo il seguente risultato:
E' possibile inoltre specificare con l'attributo "border" un bordo colorato intorno all'immagine, per esempio:
si otterrà:
E' possibile anche specificare, con l'attributo "alt", un'etichetta di testo che verrà visualizzata quando ci soffermeremo con il mouse sopra all'immagine, come nell'esempio sotto riportato:
Tramite gli attributi "height" e "width" si possono modificare le dimensioni di un'immagine, ma questo e' sconsigliabile in quanto questa perderà di qualità, si consiglia di preparare l'immagine già nelle dimensioni desiderate.
Con il codice:
si ottiene
Con il codice:
si ottiene:
Con il codice:
si ottiene:
Tramite gli attributi "hspace" e "vspace" è possibile specificare una distanza in pixel dagli altri oggetti che si trovano lungo i quattro lati dell'immagine. Per esempio scrivendo il seguente codice:
otterremo:
Dove la spaziatura orizzontale, intorno all'immagine al centro, è di 10 pixel, e la spaziatura verticale e' di 5 pixel.
Tramite l'attributo "align" infine e' possibile specificare l'allineamento dell'immagine rispetto ad altre immagini o al testo; vediamo alcuni esempi:
Con il codice:
questo è un testo
otterremo il testo allineato in alto rispetto all'immagine:
questo è un testo
Con il codice:
questo è un testo
otterremo il testo allineato al centro rispetto all'immagine:
questo è un testo
Con il codice:
questo è un testo
otterremo il testo allineato in basso rispetto all'immagine:
questo è un testo
I prossimi due attributi sono molti utili per l'inserimento di immagini all'interno di un testo lungo:
Con il codice:
questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo
otterremo l'immagine inglobata nel testo e allineata a sinistra:
questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo
Con il codice:
questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo
otterremo l'immagine inglobata nel testo e allineata a destra:
questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo questo è un testo lungo
8) link
Il link rappresenta in realtà l'anima del web in quanto senza di esso non sarebbe possibile alcuna navigazione, e tutte le funzioni principali del web (motori di ricerca, portali, ecc) sarebbero impossibili da gestire.
Per aggiungere un link dalla nostra pagina web ad un altra pagina, o sito, e' necessario utilizzare il Tag "
...testo e/o immagine", per esempio se volessimo linkare un sito web dal nostro sito, scriveremo:
Sito web ufficiale del sistema operativo Linux
otterremo:
Sito web ufficiale del sistema operativo Linux
Se facciamo clic su questo link andremo nel sito Linux, come specificato, ma questo andrà a sostituire il nostro sito, quindi perchè non farlo aprire in una nuova finestra, affinchè l'utente non vada via dal nostro sito? Questo è possibile tramite l'attributo "target", come nel seguente esempio:
Sito web ufficiale del sistema operativo Linux
e il risultato sara':
Sito web ufficiale del sistema operativo Linux
però in questo caso quando faremo clic su di esso si aprirà una nuova finestra con il link da noi specificato.
Se si vuole scrivere un testo corto ma allo stesso tempo si vuole fornire una descrizione del link, è possibile farlo con l'attributo "title", per esempio:
Linux
otterremo:
Linux
e quando andremo con il mouse sopra al link apparirà il testo specificato.
Ovviamente è possibile sostituire l'indirizzo web
www.linux.org con un file HTML del nostro sito che avremmo realizzato in precedenza, ad esempio "news.htm", oppure ad un'immagine, ad esempio "fiore.jpg", cliccando sul link si aprirà il collegamento specificato.
E' possibile inoltre utilizzare un'immagine come link cliccabile, scrivendo il seguente codice:
otterremo:
Questa è un'immagine cliccabile e funziona esattamente con il link testuale descritto sopra. Nel caso che si voglia rimuovere il bordo blu basta specificare "border=0" nel Tag dell'immagine.
Bookmark (segnalibri)
Un bookmark non è altro che un collegamento ad una sezione specifica della stessa pagina dove si trova il link, questo si ottiene inserendo un Tag particolare all'interno della pagina, cioe' "
", che ne segnala la posizione (come una bandierina o un segnalibro), poi utilizzando la solita sintassi per creare il collegamento.
Ad esempio, all'inizio di questa sezione, è stato inserito il tag:
quindi utilizzando il codice:
Torna all'inizio della sezione
si otterrà:
Torna all'inizio della sezione
e cliccando su questo link l'utente verrà sbalzato all'inizio del capitolo.
Link ad email
E' possibile anche inserire un collegamento ad un indirizzo email, in modo che l'utente, cliccando sopra, si ritrovi con il proprio client di posta aperto pronto per spedire un messaggio di posta elettronica all'indirizzo email che verrà specificato, questo aggiungendo "mailto:" nell'url, come nell'esempio:
Contattaci
si otterrà:
Contattaci
cliccando su questo link ci ritroveremo il nostro client di posta aperto con l'indirizzo email già preimpostato.
Target
L'attributo "target" è molto utile alla navigazione quando abbiamo la necessità di far aprire una pagina web o un URL esterno in una nuova finestra o in un determinato frame (che sono trattati più avanti).
Si utilizza così:
link
Nel valore di "target" va specificato un nome di un frame, al clic quella determinata pagina si aprirà nel nome del frame specificato nel valore di "target, oppure in questo valore è possibile anche specificare una delle parole chiave predefinite per far aprire, per esempio, la pagina in una nuova finestra del browser. Le principali parole chiave sono:
"_self" per aprire la pagina nello stesso frame.
"_top" per annullare i frame.
"_blank" per aprire la pagina in una nuova finestra del browser.