I tag HTML principali.
Eccoci alla seconda per così dire lezione. Qui scriverò alcuni dei più importanti tag dell'html. Abbiamo stabilito che l'html è un semplice linguaggio. Impariamo a scriverlo.
CODICE
<b>testo in grassetto</b>
CODICE
<strong>testo in grassetto</strong>
CODICE
<i>testo in corsivo</i>
CODICE
<em>testo in corsivo</em>
CODICE
<u>testo sottolineato</u>
CODICE
<s>testo sbarrato</s>
CODICE
<br> per andare a capo di una riga
CODICE
<p>paragrafo di testo</p>
Uno dei più importanti attributi che si possono aggiungere al tag p è quello per l'allineamento del testo, ovvero l'atributo align che ha come valori i seguenti:
left, (sinistra)
right, (destra)
center, (centro)
justify (giustificato)
Praticamente il testo può essere allineato a sinistra, a destra, può essere centrato e giustificato.
Per inserire l'attributo align si procede così.
CODICE
<p align="center">Testo testo testo testo</p>
CODICE
<img src="LINKIMMAGGINE">
Come si può notare bisogna fare un discorsino più approfondito per il tag img. Il tag img non ha un suo corrispondente tag di chiusura, ovvero non è
CODICE
<img>Link immagine</img>
.
L'immagine non può essere presa direttamente dal vostro harddisk, ma deve essere caricata su internet.
Cito i tre più famosi fra i servizi di hosting per immagini gratuiti che sono:
http://imageshack.us/
http://photobucket.com/ (bisogna crearsi un account)
http://tinypic.com/
E' consigliato l'utilizzo di immagini con queste tre estensioni: JPG, GIF, PNG.
Ci sono diversi valori che si possono dare al tag img. Alcuni fra i più importanti sono:
width, (larghezza dell'img)
height, (altezza dell'img)
alt, (titolo dell'immagine)
In pratica siamo in grado di dare all'immagine un’altezza, una larghezza e un titolo.
La larghezza e l'altezza non devono necessariamente corrispondere a quelle reali, possono essere ridotte o ampliate. Si consiglia di non aumentarle troppo in quanto l'immagine risulterebbe sgranata. Se si diminuiscono ricordate che il tempo di caricamento sarà uguale.
Ad esempio se io metto a un wallpaper 800 x 600 px le misure 100x100 px il caricamento dell'immagine resta invariato, poiché le dimensioni dell’immagine sono le stesse.
Il titolo dell'immagine, invece, compare quando ci soffermiamo con il cursore su essa.
In width e height non si deve inserire l'unità di misura ma solo il numero.
L'unità di misura sono sempre i pixel.
Ad esempio si dovrà fare ... width="100" height="100" ... non ... width="100px" height="100px"...
Per inserire gli attributi all'immagine si procede così:
CODICE
L'immagine non può essere presa direttamente dal vostro harddisk, ma deve essere caricata su internet.
Cito i tre più famosi fra i servizi di hosting per immagini gratuiti che sono:
http://imageshack.us/
http://photobucket.com/ (bisogna crearsi un account)
http://tinypic.com/
E' consigliato l'utilizzo di immagini con queste tre estensioni: JPG, GIF, PNG.
Ci sono diversi valori che si possono dare al tag img. Alcuni fra i più importanti sono:
width, (larghezza dell'img)
height, (altezza dell'img)
alt, (titolo dell'immagine)
In pratica siamo in grado di dare all'immagine un’altezza, una larghezza e un titolo.
La larghezza e l'altezza non devono necessariamente corrispondere a quelle reali, possono essere ridotte o ampliate. Si consiglia di non aumentarle troppo in quanto l'immagine risulterebbe sgranata. Se si diminuiscono ricordate che il tempo di caricamento sarà uguale.
Ad esempio se io metto a un wallpaper 800 x 600 px le misure 100x100 px il caricamento dell'immagine resta invariato, poiché le dimensioni dell’immagine sono le stesse.
Il titolo dell'immagine, invece, compare quando ci soffermiamo con il cursore su essa.
In width e height non si deve inserire l'unità di misura ma solo il numero.
L'unità di misura sono sempre i pixel.
Ad esempio si dovrà fare ... width="100" height="100" ... non ... width="100px" height="100px"...
Per inserire gli attributi all'immagine si procede così:
CODICE
<img src="LINK" width="misura" height="misura" alt="titolo immagine">
CODICE
<a href="www.google.it">Google</a>
Questo è il codice per inserire un link in una pagina internet.
Gli attributi maggiormente usati sono:
alt, (titolo)
target, (indica dove si deve aprire la pagina)
L'attributo alt l'abbiamo già visto. L'attributo target ha valori differenti io vi cito il più usato che è il _blank . Serve per far aprire la pagina in un altra finestra e non nella stessa che state visualizzando.
In pratica il codice sarà così:
CODICE
<a href="www.google.it" alt="Google" target="_blank">Google</a>
Fra CODICE
<a.....> e </a>
si deve sempre inserire un testo.
Per usare un'immagine come collegamento, invece che il semplice testo si fa così:
CODICE
<a href="urlsito" target="_blank" alt="titolo"><img src="linkimmagine" alt="titolo immagine" width="misura" height="misura"></a>
Praticamente fra CODICE
<a.....> e </a>
si inserisce il codice dell'immagine e non il testo.
Solitamente i browser mettono un bordo predefinito all'immagine che viene utilizzata come collegamento. Per togliere il bordo, a mio parere antiestetico, si procede in questo modo:
CODICE
Solitamente i browser mettono un bordo predefinito all'immagine che viene utilizzata come collegamento. Per togliere il bordo, a mio parere antiestetico, si procede in questo modo:
CODICE
<a href="urlsito" target="_blank" alt="titolo"><img src="linkimmagine" alt="titolo immagine" width="misura" height="misura" border="0"></a>
Abbiamo inserito l'attributo border al tag img e gli abbiamo assegnato 0 come valore. In questo caso il bordo è stato tolto.
A presto con il prossimo argomento.
« Back
