|
|
Guida Rapida all' HTML V E R S I O N E 5
Versione 5
Riconoscimenti:
Guida consigliata da "McGraw-Hill" nell'inserto "Computer
NOPROBLEM" distribuito da "la Repubblica"
Inserto N.16 Scrivere nel World Wide Web
"...suggeriamo una sintetica ma esauriente guida ai comandi presente
all'indirizzo https://www.internew.com/program ..."
Sommario Note dell'editore Commenti relativi all'ultima versione, indirizzi utili per questa guida, posta elettronica Introduzione al linguaggio HTML Che cos' è l'ipertesto ed in particolare l' HTML Generale Struttura di base di un documento HTML Formattazione Dal grassetto all'allineamento, dal colore all'impostazione della grandezza del testo Collegamenti (Link, Hyperlink, Ancore) Capire e strutturare i link interni ed esterni dei documenti ipertestuali Immagini Inserimento di immagini, loro dimensione e risoluzione video Mappe: definizione Creare immagini intelligenti!!! , tipi di mappature e programmi di utilità Segni di
paragrafo e argomento Liste libere, elenchi puntati e numerati, liste composte Sfondi e colori Attributi colore del documento, programmi per gestire colori RGB Caratteri speciali Tabelle di conversione e di consultazione per caratteri latin e simboli di utilità generica Moduli , Schede o form Tutti i tag per la creazione di form complessi e di acquisizione dati utente Tabelle Uso delle tabelle per presentazione dati e per impaginazioni di alto livello grafico Frames Divisione e gestione della finestra del browser in porzioni Target (destinazione dei link) Gestione della destinazione dell' output proveniente da link o processi server come risposte di form Varie e curiosità Comandi non classificabili nelle sezioni precedenti Condizioni d'uso del manuale Tutto quello che
dovete sapere per un corretto uso di questo manuale e i diritti di
distribuzione |
Alcune sezioni del Sommario non sono presenti nella versione del manuale distribuita su Internet
G E N E R A L E
(impostazioni obbligatorie del documento ipertestuale)
|
||
Tipo di documento |
<HTML></HTML> |
(inizio e fine del file, tag obbligatorio) |
Testata |
<HEAD></HEAD> |
(descrizioni varie; come il titolo e i Meta Name) |
Titolo documento |
<TITLE></TITLE> |
(nome del documento; contenuto in Head) |
Contenuto |
<BODY></BODY> |
(corpo del file) |
F O R M A T T A Z I O N E
D E L T E&nb 444h75e sp;S T O
Aggiornata il 21-marzo-1997
Titoli di paragrafo e capitoli |
<H?></H?> |
(sono possibili 6 diversi livelli di grandezza ed importanza h1,h2, etc.) |
|
Allineamento titolo |
<H? ALIGN=LEFT|CENTER|RIGHT></H?> |
|
|
Divisione di un blocco |
<DIV></DIV> |
usato per porzioni di testo o paragrafi |
|
Allineamento del blocco |
<DIV ALIGN=LEFT|RIGHT|JUSTIFY|CENTER></DIV> |
|
|
Formattazioni particolari |
|
|
|
Citazioni |
<BLOCKQUOTE></BLOCKQUOTE> |
rientrato |
|
Evidenziato |
<EM></EM> |
corsivo |
|
Molto marcato |
<STRONG></STRONG> |
neretto |
|
Citazione |
<CITE></CITE> |
corsivo |
|
Codice programm. |
<CODE></CODE> |
programmi |
|
Esempio |
<SAMP></SAMP> |
|
|
Immissione da tastiera |
<KBD></KBD> |
carattere a spaziatura fissa |
|
Variabile |
<VAR></VAR> |
|
|
Definizione |
<DFN></DFN> |
|
|
Indirizzo dell'autore |
<ADDRESS></ADDRESS> corsivo |
|
|
Font grande |
<BIG></BIG> |
|
|
Font piccolo |
<SMALL></SMALL> |
|
|
Grassetto |
<B></B> |
|
|
Corsivo |
<I></I> |
|
|
Sottolineato |
<U></U> |
(non più supportato) |
|
Depennato (Strikeout) |
<S></S> |
|
|
Pedice |
<SUB></SUB> |
|
|
Apice |
<SUP></SUP> |
|
|
Font non scalabile |
<TT></TT> |
(spaziatura fissa) |
|
Preformattato |
<PRE></PRE> |
(mantiene gli allineamenti originali) |
|
Larghezza |
<PRE WIDTH=?></PRE> |
(in caratteri) |
|
Centrato |
<CENTER></CENTER> |
(sia per testo che immagini) |
|
Intermittente |
<BLINK></BLINK> |
(il comando più ridicolo) |
|
Specifica il tipo di Font |
<FONT
FACE="Verdana,Arial,Helvetica, |
|
HTML3 |
Grandezza del Font |
<FONT SIZE=?></FONT> |
(valori da 1 a 7) |
|
Cambia la grandezza del font |
<FONT SIZE=+|-?></FONT> |
|
|
Grandezza font di base |
<BASEFONT SIZE=?> |
(da 1 a 7; il valore di default e' 3) |
|
Colore del Font |
<FONT Color="#$$$$$$"></FONT> |
|
C O L L E G A M E N T I N E L T E S T O E A D A L T R I F I L E
Collegamento di base |
<A HREF="URL"></A> |
||
link ad un' ancora nel file |
<A HREF="URL#$$$$"></A> |
(in altro file) |
|
|
<A HREF="#$$$$"></A> |
(nello stesso file) |
|
ad un file indicando la destinazione |
<A HREF="URL" TARGET="$$$$"></A> |
(nello stesso file) |
|
Definizione di ancora nel file |
<A NAME="$$$$"></A> |
|
|
I M M A G I N I
Inserimento di una immagine |
<IMG SRC="URL"> |
|
Allineamento |
<IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE> |
|
Allineamento |
<IMG SRC="URL" ALIGN=LEFT|RIGHT|TEXTTOP|ABSMIDDLE|BASELINE> |
|
testo alternativo |
<IMG SRC="URL" ALT="$$$$"> |
(quando non viene visualizzata l'immagine si vedra' il testo carattere) |
Mappa navigabile |
<IMG SRC="URL" ISMAP> |
(richiede un script) |
Mappa navigabile client-side o locale |
<IMG SRC="URL" USEMAP="URL#$$$$"> |
|
Dimensioni |
<IMG SRC="URL" WIDTH="?" HEIGHT="?"> |
(in pixel) |
Bordi |
<IMG SRC="URL" BORDER=?> |
(in pixel) |
Bassa risoluzione |
<IMG SRC="URL" LOWSRC="URL"> |
|
Spaziatura |
<IMG SRC="URL" HSPACE=? VSPACE=?> |
|
M A P P E
Old: occorre conoscere in molti casi la directory sul server per
posizionare il file .map di definizione
Aggiornamento: Usando un tipo di dichiarazione Client-Side il file .map
non è più necessario. La definizione di mappa può essere dichiarata all'interno
del file documento HTML. Per la dichiarazione si usa il codice <MAP
NAME="nome della mappa"> </MAP> come indicato sotto.
Specifica della mappa |
<MAP NAME="$$$$";></MAP> |
(descrive la mappa) |
Sezione mappa |
<AREA SHAPE="RECT|CIRCLE|POLYGON" COORDS=",,," HREF="URL"|NOHREF> |
|
|
Consigliamo un programma tipo MapThis per la creazione del file .map e per la specifica delle coordinate dei segmenti |
|
S E G N I D I P A R A G R A F O E D A R G O M E N T O
Paragrafo |
<P></P> |
(lascia due righe bianche) |
Allineamento |
<P ALIGN=LEFT|CENTER|RIGHT></P> |
|
Interruzione riga |
<BR> |
(ritorno a capo) |
Riga orizzontale |
<HR> |
|
Parametri: |
|
|
Allineamento |
<HR ALIGN=LEFT|CENTER|RIGHT> |
|
Spessore |
<HR SIZE=?> |
(in pixel) |
Larghezza |
<HR WIDTH=?> |
(in pixel) |
in % |
<HR WIDTH=%> |
(come percentuale della larghezza della pagina) |
No effetto 3D |
<HR NOSHADE> |
|
L I S T E Elenchi semplici, composti, numerati o puntati
Liste libere |
<UL><LI></UL> |
(<LI> prima di ogni elemento) |
|
Punto |
<UL TYPE=DISC|CIRCLE|SQUARE> |
( valido per tutta la lista) |
|
|
<LI TYPE=DISC|CIRCLE|SQUARE> |
(valido per questo e i successivi) |
|
Liste numerate |
<OL><LI></OL> |
(<LI> prima di ogni elemento) |
|
Tipo di numero |
<OL TYPE=A|a|I|i|1> |
(valido per per tutta la lista) |
|
|
<LI TYPE=A|a|I|i|1> |
(valido per questo e i successivi) |
|
Numero di partenza |
<OL VALUE=?> |
(per tutta la lista) |
|
<LI VALUE=?> |
(questo e successivi) |
|
|
Lista di definizioni |
<DL><DT><DD></DL> |
Molto usata nella definizione dei menu |
|
Se date un'occhiata al sorgente di questa guida avrete un valido esempio della Lista di Definizione :-) |
|
|
|
S F O N D I E D E F I N I Z I O N E D I C O L O R E
Colore di sfondo |
<BODY BGCOLOR="#$$$$$$"> |
(in ordine di RGB) |
colore dei collegamenti |
<BODY LINK="#$$$$$$"> |
|
colore dei collegamenti visitati |
<BODY VLINK="#$$$$$$"> |
|
colore del testo |
<BODY TEXT="#$$$$$$"> |
|
colore del collegamento in corso |
<BODY ALINK="#$$$$$$"> |
|
immagine di sfondo |
<BODY BACKGROUND="URL"> |
|
Clicca per avere l'immagine dell' ELENCO DEI COLORI
Un ringraziamento particolare a Doug Jacobson per la realizzazione della mappa!
C A R A T T E R I
S P E C I A L I
Il seguente elenco non è completo ma comprende i caratteri maggiormente usati
nei documenti HTML per usi particolari. Per maggiori informazioni consiglio di
consultare le pagine del CERN.
carattere speciale |
&#?; (? indica il codice ISO) |
carattere speciale |
&#?; (? indica il codice ISO) |
|
< |
< |
Ograve Ò |
Ò |
|
> |
> |
Ocirc Ô |
Ô |
|
& |
& |
Otilde |
Õ |
|
" |
" |
Ouml |
Ö |
|
Aacute |
Á |
Oslash |
Ø |
|
Agrave À |
À |
|
|
|
Acirc  |
 |
Uacute Ú |
Ú |
|
Atilde à |
à |
Ugrave Ù |
Ù |
|
Aring |
Å |
Ucirc Û |
Û |
|
Auml Ä |
Ä |
Uuml Ü |
Ü |
|
AElig Æ |
Æ |
Yacute Ý |
Ý |
|
Ccedil Ç |
Ç |
THORN Þ |
Þ |
|
Eacute |
É |
aelig æ |
æ |
|
Egrave È |
È |
eacute é |
é |
|
Ecirc Ê |
Ê |
egrave è |
è |
|
Euml Ë |
Ë |
ecirc ê |
ê |
|
Iacute Í |
Í |
euml ë |
ë |
|
Igrave Ì |
Ì |
reg |
® Registered TradeMark |
|
Icirc Î |
Î |
copy © |
© Copyright |
|
Iuml |
Ï |
trade ™ |
™ TradeMark |
|
ETH Ð |
Ð |
nbsp |
Non breaking space |
|
Ntilde |
Ñ |
|
|
|
Oacute |
Ó |
|
|
|
M O D U L I
Per ottenere risposte ottimali occorre uno script di tipo cgi sul server
oppure si puo' usare il mailto: abbinato al POST
Script di tipo mail si possono trovare facilmente e gratuitamente in vari
server Internet, con allegata documentazione per l'uso.
Definizione |
<FORM ACTION="URL" METHOD=GET|POST></FORM> |
|
Upload di file |
<FORM ENCTYPE="multipart/form-data"></FORM> |
|
Campo di immissione |
<INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO| IMAGE|HIDDEN|SUBMIT|RESET"> |
|
Nome campo |
<INPUT NAME="$$$$"> |
|
Valore del campo |
<INPUT VALUE="$$$$"> |
|
Lunghezza massima |
<INPUT MAXLENGTH=?> |
(in caratteri) |
Selezionato di default |
<INPUT CHECKED> |
(checkbox e radio) |
Grandezza |
<INPUT SIZE=?> |
|
Selezione elenco delle opzioni |
<SELECT></SELECT> |
|
|
<SELECT NAME="$$$$"></SELECT> |
|
Numero opzioni |
<SELECT SIZE=?></SELECT> |
|
Selezione multipla |
<SELECT MULTIPLE> |
(per selezionare più di 1 elemento) |
Opzioni |
<OPTION> |
(elementi che possono essere selezionati) |
Opzione di default |
<OPTION SELECTED> |
|
Finestra di immissione |
<TEXTAREA ROWS=? COLS=?></TEXTAREA> |
|
Nome del campo |
<TEXTAREA NAME="$$$$"></TEXTAREA> |
|
A capo automatico in diversi modi |
<TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL></TEXTAREA> |
T A B E L L E
Definizione tabella |
<TABLE></TABLE> |
||
Bordo |
<TABLE BORDER></TABLE> |
(per visualizzare il bordo) |
|
Si puo' impostare lo spessore del bordo |
<TABLE BORDER=?></TABLE> |
(per indicare lo spessore) |
|
|
|
|
|
Spazio tra le celle |
<TABLE CELLSPACING=?> |
|
|
Spazio tra testo e bordo |
<TABLE CELLPADDING=?> |
|
|
Larghezza tabella |
<TABLE WIDTH=?> |
(in pixel) |
|
Larghezza tabella in % |
<TABLE WIDTH=%> |
(percentuale della pagina) |
|
Riga |
<TR></TR> |
|
|
Allineamento |
<TR ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM> |
|
|
Campo dati |
<TD></TD> |
(definita dentro una definizone di riga) |
|
Allineamento |
<TD ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM> |
|
|
No interruzione |
<TD NOWRAP> |
|
|
Colonne da occupare |
<TD COLSPAN=?> |
|
|
Righe da occupare |
<TD rowspan='?>' |
|
|
Larghezza desiderata |
<TD WIDTH=?> |
(in pixel) |
|
Larghezza desiderata in % |
<TD WIDTH=%> |
(percentuale della tabella) |
|
Titolo della colonna |
<TH></TH> |
(come <TD>, ma in neretto e centrata) |
|
Legenda della tabella |
<CAPTION></CAPTION> |
|
|
Allineamento |
<CAPTION ALIGN=TOP|BOTTOM> |
(sopra o sotto la tabella) |
|
F R A M E
Divisione e gestione di parti della finestra del browser
ATTENZIONE: la compatibilità dei Frame è limitata al Netscape 2.0 e succ. e
all'explorer Microsoft ultima ver.
Questa sezione viene aggiornata con le nuove specifiche HTML3 in data
21-marzo-1997
Documento FRAME |
<FRAMESET></FRAMESET> |
(al posto di <BODY>) |
|
altezza in righe |
<FRAMESET ROWS=,,,></FRAMESET> |
(pixel o %) |
|
altezza in righe |
<FRAMESET ROWS=*></FRAMESET> |
(* = misura relativa) |
|
larghezza in colonne |
<FRAMESET COLS=,,,></FRAMESET> |
(pixel o %) |
|
larghezza in colonne |
<FRAMESET COLS=*></FRAMESET> |
(* = misura relativa) |
|
Definizione |
<FRAME> |
(contenuto di ogni singolo quadro) |
|
Gestione dei bordi |
<FRAME BORDER=Yes | No Bordercolor="RGB"> |
|
Presente sia in FRAMES che in FRAMESET |
Bordo in Frameset |
<FRAMESET Bordercolor="canale RGB"> |
|
|
Gestione dei Margini |
<FRAME MARGIN="xx,yy"> |
|
|
Visualizza documento |
<FRAME SRC="URL"> |
|
|
Nome del frame |
<FRAME NAME="$$$$"|_blank|_self|_parent|_top> |
|
|
Larghezza margine |
<FRAME MARGINWIDTH=?> |
(margine destro e sinistro) |
|
Altezza margine |
<FRAME MARGINHEIGHT=?> |
(margine alto e basso) |
|
Barra di scorrimento? |
<FRAME SCROLLING="YES|NO|AUTO> |
|
|
Misure non modificabili |
<FRAME NORESIZE> |
|
|
Contenuto in assenza di frame |
<NOFRAMES></NOFRAMES> |
(per i browser che non supportano FRAME) |
T A R G E T (DESTINAZIONE DEI LINK)
target in una definiz. di ancora |
< A HREF="url" TARGET="nome_finestra">Ancora di destinazione </A> |
Visualizza il link nella finestra indicata nel target |
target di base |
< BASE TARGET="nome_finestra"> |
Imposta di default la finestra indicata nel target |
target in una mappa |
< AREA SHAPE="shape" COORDS="x,y,..."> TARGET="finestra_destinazione"> |
Visualizza il link risulatto dalla mappa nella finestra indicata dal target |
target in un form |
< FORM ACTION="url" TARGET="nome_finestra"> |
Visualizza il risultato del form nella finestra indicata nel target |
Target Speciali |
TARGET="_blank" |
Visualizza il link in nuova finestra vuota |
Target Speciali |
TARGET="_self" |
link nella stessa finestra |
Target Speciali |
TARGET="_parent" |
link nella finestra parente. Se non esiste diventa come _self |
Target Speciali |
TARGET="_top" |
link nella stessa finestra ma a tutto schermo |
V A R I E
Aggiornata il 20-marzo-1997
Mulicolonne |
<MULTICOL COLS="$$" GUTTER="$$" WIDTH="$$"> |
|
Imposta più colonne definendo il numero di colonne, la spaziatura e la larghetta fissa o in percentuale |
|
|
|
|
Relazioni |
<LINK REV="$$$$" REL="$$$$" HREF="URL"> |
(nella testata) |
|
Meta Informazioni |
<META> |
(deve essere nella testata) |
|
Commenti |
<!-- $$$$ --> |
(non visualizzati dal browser) |
|
Prologo |
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN"> |
|
|
Prologo |
<!DOCTYPE HTML PUBLIC "-//W3O//DTD W3 HTML 3.0//EN"> |
|
|
Prologo |
<!DOCTYPE HTML PUBLIC "-//microsoft corp.//DTD HTML //EN"> |
|
|
Ricerca |
<ISINDEX> |
(indica che è un documento collegato ad un database indicizzato in cui è possibile fare ricerche) |
|
Domanda |
<ISINDEX PROMPT="$$$$"> |
(testo da anteporre alla casella di inserimento) |
|
Invio ricerca |
<A HREF="URL?$$$$"></a> |
(usare il punto di domanda) |
|
URL base di questo file |
<BASE HREF="URL"> |
(deve essere nella testata) |
Privacy |
Articolo informazione
Commentare questo articolo:Non sei registratoDevi essere registrato per commentare ISCRIVITI |
Copiare il codice nella pagina web del tuo sito. |
Copyright InfTub.com 2024