Ultima modifica:
Ciao a tutti =) oggi vi farò una guida .. anche se ne vedo molte altre su quasi tutti i codici html ( la faccio tanto per fare non serve critiche perchè le hanno fatte molti altri .. per passare il tempo 
):
allora..Spieghiamo un pò di cose.Le parole dentro a < > sono chiamati tag...il maggiore e il minore indicano semplicemente al browser(colui che interpetra l html e lo muta in pagina effettiva) che quelle scritte non devono essere mostrate sul sito.
un normale documento html inizia sempre con il tag html compreso fra maggiore e minore.poi si inserisce il tag head,overo la testa,poi i tag body,cioè il corpo,e infine i tag vengono seguiti come vediamo da questo segno /.
Quel segno stà a significare che li il tag termina...ricordatevi che ogni tag che incontrerete deve sempre essere terminato,altrimenti sarà eseguito all infinito.
Nella sezione head possiamo trovare il tag
tra i due tag và inserito il titolo della pagina,che comparirà nella finestra del browser
Sempre nella sezione head potremo trovare metatags,che comprendono per esempio parole chiavi,quindi informazioni in maggiornanza utili per i motori di ricerca.
Passiamo ora alla sezione BODY
in questa sezione troviamo quindi immagini,scritte formattate.
Qui ci sono quasi tutti i colori utilizzabili col HTML
Torniamo a " <basefont .... > "
Questo tag basefont deve essere messo subito dopo il tag body,e serve per indicare lo stile del carattere di scrittura,la grandezza(size=),il colore("vi spiegherò dopo il perchè di FFFFFF)...come avete notato ci sono l arial,i verdana e il courier,ovvero 3 stili di scrittura.Questo perchè verrà usato il primo font disponibile del computer del visitatore.
Ecco alcuni tag principali:
Per Modificare una scrittura sul sito web,si usa il tag:
Facciamo un esempio:
con "color" si definisce il colore del testo, con "face" si definisce lo stile, e "size" la grandezza.
Per creare un link(collegamento) si usa il tag
per indicare la destinazione del link quando verrà cliccato si usa cosi:
Mettiamo che vogliamo fare " Clicca qui " e " qui se ci clicchi sopra ti apre il collegamento " quindi ..
( se non avete capito tra href" " và inserita la destinazione.
Per decidere la grandezza di un testo si possono anche usare i tag :
( basta sapere un minimo di inglese xD ) Comunque "small"vuol dire piccolo .. quindi il testo verrà piccolo e "big" il testo verrà grande
Invece per fare le scritte scorrevoli si usa il tag :
invece se la scritta si vuole la scritta colorata si usa sempre il tag
Ecco altri tag che potete mettere insieme al testo scorrevole ( marquee ) :
Adesso pensiamo un po' al layout del testo .. si usano i tag :
Invece per creare una lista si usano i tag :
Inoltre il tag ul può avere suoi suddivisibili tipi di liste che sono :
nche ol può avere diversi tipi ovvero :
Per inserire un immagine e farla vedere si usa il tag:
Si possono cambiare le dimensioni dell'immagine con due attributi .. ovvero :
width è la larghezza e hejght è la altezza
Si può anche aggiungere un bordo all'immagine in questo modo:
Si può aggiungere spazio bianco alle immagini in questo modo:
Hspace è lo spazio destra e sinistra e Vspace è lo spazio sopra e sotto
A un immagine si possono attribuire diverse posizionamenti in questo modo:
E la lista degli allineamenti è :
default -allinea l'immagine usando gli attributi di default del Web browser. E' come baseline.
left- allinea l'immagine al margine sinistro e avvolge il testo che segue l'immagine.
right- allinea l'immagine al margine destro e avvolge il testo che precede l'immagine.
top- allinea la parte superiore dell'immagine con il testo intorno.
texttop- allinea la parte superiore dell'immagine con la parte superiore del testo situato più in alto sulla linea.
middle- allinea la parte mediana dell'immagine con il testo intorno.
absmiddle- alinea l'immagine con il centro della linea corrente.
baseline- allinea l'immagine con il baseline della linea corrente.
bottom- allinea la parte inferiore dell'immagine con il testo intorno.
absbottom- allinea l'immagine con la parte inferiore della linea corrente.
center- allinea il centro dell'immagine con il testo intorno.
Parliamo ora meglio dei link
come abbiamo gia detto per creare un link si usa il tag a
per definire il colore dei vari tipi di link si attribusce al tag body i seguenti valori:
#FF0000 rappresentana il codice del colore.
link è il normale link mentre alink=link quando è toccato da mouse vlink è il link gia cliccato
per definire il colore di un semplice link si fà cosi:
I link possono avere varie mete:
_blank -scarica la pagina in una nuova finestra del browser.
_self -scarica la pagina nella finestra corrente.
_parent -scarica la pagina in una cornice superiore a quella in cui si trova l'hyperlink.
_top -cancella tutte le cornici, e scarica in una finestra intera del browser.
Si possono anche creare link di immagini in questo modo:
Si può inoltre far si che in base al punto in cui si clicca un immagine,vi sia una destinazione diversa con questi tag :
___________________________________________________________________________________________
Spero che la mia guida via sia piaciuta e che sia comprensibile
+1 Ben accettate
Se c'è qualcosa che non capite .. Chiedetemelo pure velo spiegherò meglio
):
Codice:
<html>
<head>
<!-- Questa sezione è per il titolo e le informazioni tecniche sulla pagina. -->
</head>
<body>
<!-- Questa sezione è per tutto quello che vuoi mostrare sulla pagina . -->
</body>
</html>un normale documento html inizia sempre con il tag html compreso fra maggiore e minore.poi si inserisce il tag head,overo la testa,poi i tag body,cioè il corpo,e infine i tag vengono seguiti come vediamo da questo segno /.
Quel segno stà a significare che li il tag termina...ricordatevi che ogni tag che incontrerete deve sempre essere terminato,altrimenti sarà eseguito all infinito.
Nella sezione head possiamo trovare il tag
Codice:
<title> </title>Sempre nella sezione head potremo trovare metatags,che comprendono per esempio parole chiavi,quindi informazioni in maggiornanza utili per i motori di ricerca.
Passiamo ora alla sezione BODY
in questa sezione troviamo quindi immagini,scritte formattate.
Codice:
<body>
<basefont face="arial, verdana, courier" size="4" color="#FFFFFF">Torniamo a " <basefont .... > "
Questo tag basefont deve essere messo subito dopo il tag body,e serve per indicare lo stile del carattere di scrittura,la grandezza(size=),il colore("vi spiegherò dopo il perchè di FFFFFF)...come avete notato ci sono l arial,i verdana e il courier,ovvero 3 stili di scrittura.Questo perchè verrà usato il primo font disponibile del computer del visitatore.
Ecco alcuni tag principali:
Codice:
<b>Testo in grassetto</b>
<i>testo corsivo</i>
<u>testo sottolineato</u>
<blink>testo accendi-spegni( anche se a me non funziona però esiste come tasto accendi e spegni .. )</blink>
Codice:
<font>
Codice:
<font color=#00FF00 face=arial size=2>
Questa parte di testo è diversa.
</font>Per creare un link(collegamento) si usa il tag
Codice:
<a>Mettiamo che vogliamo fare " Clicca qui " e " qui se ci clicchi sopra ti apre il collegamento " quindi ..
Codice:
Clicca <a href="URL della pagina desiderata .. es: ( www.inforge.net )">qui</a>Per decidere la grandezza di un testo si possono anche usare i tag :
Codice:
<small> e <big>Invece per fare le scritte scorrevoli si usa il tag :
Codice:
<marquee>testo che volete inserire</marquee>invece se la scritta si vuole la scritta colorata si usa sempre il tag
Codice:
<font color=colore desiderato><marquee>testo</marquee></font>
Codice:
<bgcolor> - va inserito il colore di sfondo in esadecimale o parola
<width> - lunghezza in pixel del campo
<height> - altezza in pixel del campo
<dircetion> - va inserito right o left a seconda che si voglia far partire il testo da destra o sinistra
<behavior> - va inserito scroll o alternate o slide a seconda che si voglia far continuare a scorrere il testo all'infunito, che si voglia farlo rimbalazare da una parte all'altra del campo o che si voglia far fermare lo scorrimento una volta raggiunta la fine del campo
<valign> - seguito da top, middle o bottom a seconda che si volgia allineare in termini di alezza il testo in alto, in centro o in bassoAdesso pensiamo un po' al layout del testo .. si usano i tag :
Codice:
<p>testo</p> Aggiunge un spazio(porta il testo da capo).
<p align="left">testo</p> Porta a capo e posiziona il testo a sinistra.
<p align="center">testo</p> Porta a capo e posiziona centralmente.
<p align="right">testo</p> Porta a capo e posiziona il testo a destra.
testo<br>Porta a capo
<nobr>testo</nobr> Elimina gli "a capo" automatici
testo<wbr> Permette al browser di inserire un "a capo"
esattamente in questo punto
<center>testo</center> Testo centrale.
<div align="center">text</div> Testo centrale.
<div align="left">text</div> Testo giustificato a sinistra.
<div align="right">text</div> Testo a destraInvece per creare una lista si usano i tag :
Codice:
<ul> crea una lista contrassegnata da punti
<ol> crea una lista contrassegnata da numeri
<li> crea una lista senza contrassegnazioniInoltre il tag ul può avere suoi suddivisibili tipi di liste che sono :
Codice:
<ul type="disc"> disco
<ul type="circle"> cerchio
<ul type="square"> quadratonche ol può avere diversi tipi ovvero :
Codice:
<ol start="5"> lista che parte da 5
<ol type="A"> lista che usa lettere
<ol type="a"> utilizza altre tipi di lettere
<ol type="I"> utilizza numeri romani
<ol type="i"> Romani minuscoli
<ol type="1"> Numeri normali
<ol type="I" start="7"> numeri romani partendo da 7Per inserire un immagine e farla vedere si usa il tag:
Codice:
<img src="indirizzo immagine">Si possono cambiare le dimensioni dell'immagine con due attributi .. ovvero :
Codice:
<img src="Indirizzo immagine" width="60" height="60">width è la larghezza e hejght è la altezza
Si può anche aggiungere un bordo all'immagine in questo modo:
Codice:
<img src="indirizzo immagine" border="5">Si può aggiungere spazio bianco alle immagini in questo modo:
Codice:
<img src="indirizzo immagine" Hspace="30" Vspace="10">Hspace è lo spazio destra e sinistra e Vspace è lo spazio sopra e sotto
A un immagine si possono attribuire diverse posizionamenti in questo modo:
Codice:
<img src="indirizzo immagine" align="tag allineamento">E la lista degli allineamenti è :
default -allinea l'immagine usando gli attributi di default del Web browser. E' come baseline.
left- allinea l'immagine al margine sinistro e avvolge il testo che segue l'immagine.
right- allinea l'immagine al margine destro e avvolge il testo che precede l'immagine.
top- allinea la parte superiore dell'immagine con il testo intorno.
texttop- allinea la parte superiore dell'immagine con la parte superiore del testo situato più in alto sulla linea.
middle- allinea la parte mediana dell'immagine con il testo intorno.
absmiddle- alinea l'immagine con il centro della linea corrente.
baseline- allinea l'immagine con il baseline della linea corrente.
bottom- allinea la parte inferiore dell'immagine con il testo intorno.
absbottom- allinea l'immagine con la parte inferiore della linea corrente.
center- allinea il centro dell'immagine con il testo intorno.
Parliamo ora meglio dei link
come abbiamo gia detto per creare un link si usa il tag a
per definire il colore dei vari tipi di link si attribusce al tag body i seguenti valori:
Codice:
<body link="#C0C0C0" vlink="#808080" alink="#FF0000">#FF0000 rappresentana il codice del colore.
link è il normale link mentre alink=link quando è toccato da mouse vlink è il link gia cliccato
per definire il colore di un semplice link si fà cosi:
Codice:
<a href="URL pagina desiderata"><font color="#FF00CC">testo</font></a>I link possono avere varie mete:
Codice:
<a href="URL pagina desiderata" target="_blank">_blank -scarica la pagina in una nuova finestra del browser.
_self -scarica la pagina nella finestra corrente.
_parent -scarica la pagina in una cornice superiore a quella in cui si trova l'hyperlink.
_top -cancella tutte le cornici, e scarica in una finestra intera del browser.
Si possono anche creare link di immagini in questo modo:
Codice:
<a href="URL pagina desiderata"><img src="Indirizzo immagine"></a>Si può inoltre far si che in base al punto in cui si clicca un immagine,vi sia una destinazione diversa con questi tag :
Codice:
<img src="Immagine desiderata" usemap = #example border=0>
<map name=example>
<area shape=Rect Coords=0,0,29,29 href="URL pagina desiderata">
<area shape=Rect Coords=30,30,59,59 href="URL pagina desiderata">
</map>___________________________________________________________________________________________
Spero che la mia guida via sia piaciuta e che sia comprensibile
+1 Ben accettate
Se c'è qualcosa che non capite .. Chiedetemelo pure velo spiegherò meglio
