docComandi principali del linguaggio HTML (Hyper Text Markup
download 
Reclamo Transcript
Comandi principali del linguaggio HTML (Hyper Text Markup
Comandi principali del linguaggio HTML (Hyper Text Markup Language)
Caratteristiche di HTML
HTML è un linguaggio di formattazione (markup) di documenti ed è il linguaggio base per
produrre documenti per il WWW.
Un documento HTML è un file di testo (file ASCII) contenente dei comandi per
• Formattazione
• Inserimento parti multimediali
• Link ipertestuali
• …
I comandi (TAG) hanno una forma sintattica particolare:
< NOME-COMANDO>
INFORMAZIONI
</NOME –COMANDO>
le informazioni tra <NOME-COMANDO> e </NOME-COMANDO> devono essere trattate
secondo quanto stabilito dal comando stesso
•
•
i comandi (tag) hanno nomi mnemonici
esistono degli editor (web editor) che assistono nella creazione delle pagine
(WYSIWYG=What You See Is What You Get)
Un documento HTML è costituito da due parti
<HTML>
<HEAD>
descrizione delle caratteristiche del documento
</HEAD>
<BODY>
documento vero e proprio
</BODY>
</HTML>
HEAD
La parte fondamentale è il titolo del documento che verrà visualizzato come titolo nella finestra del
browser
BODY
Contiene il documento (pagina) vero e proprio
Documento di testo
Il testo può essere inserito liberamente nella parte BODY e verrà visualizzato secondo le direttive di
formattazione
Headers
Permettono di indicare quali parti del testo vengono usate come titoli
<HI> titolo1 </H1> carattere grande
….
<H6> titolo6 </H6> carattere piccolo
Comandi per andare a capo
<BR> a capo
<P> a capo e inizio nuovo paragrafo
Colori
il comando BODY ha delle opzioni che permettono di stabilire lo stile dei caratteri e dello sfondo
<BODY bgcolor=”colore sfondo”
text=”colore testo”
background=” pathname del file con immagine per lo sfondo”
link=”colore link da visitare”>
Colori: si può scrivere il colore es:
<BODY bgcolor=”red”>
oppure specificare la codifica RGB
<BODY bgcolor=”#FF0000”>
avrò per il verde:”#00FF00”
e per il blu:”#0000FF”
Font
caratteri: stile, dimensione, colore
<FONT size= [con valori da 1 a 7] dimensione
color= colore
face= {font}>
es.:
<FONT size= 3
color=”red”
face= “arial”>
link ipertestuali
<A HREF=”nomefile.html”> link </A>
<A HREF=”URL”> link </A>
es.: <A HREF=”http://www.google.it”>visita google</A>
<A HREF=”Indirizzo e-mail”> link </A>
es.: <A HREF=”mailto:[email protected]”>contatto</A>
Formato
esistono vari modi per cambiare il formato dei caratteri
stili fisici
<B> testo </B> { testo in grassetto}
<I> testo </I> {testo in corsivo}
<TT> testo </TT> {testo typewriter, cioè macchina da scrivere}
Allineamento
Il comando <P> ha l’opzione align per l’allineamento del testo nel paragrafo
<P align= left> testo allineato a sinistra </P>
<P align=right> testo allineato a destra </P>
<P align= center>testo allineato al centro </P>
es.
<CENTER>
testo tabella o immagine da centrare
</CENTER>
Liste non numerate UL e LI
<UL>
<LI> impresa
<LI> massa
<LI> multimediale
</UL>
Liste numerate OL e LI
<OL>
<LI> impresa
<LI> Massa
<LI> multimedia
</OL>
Testo preformattato
È possibile dare disposizioni affinché una parte di testo non venga formattata
<PRE>
questo testo sarà lasciato come è scritto
</PRE>
Commenti
Può essere utile mettere dei commenti nel documento che non sono visualizzati dal browser
<!--Questo è un commento-->
Immagini
HTML permette di inserire immagini usando <IMG>
Il comando IMG ha vari attributi
<IMG
src=”pathname” o “URL dell’immagine”
alt= text
{testo alternativo all’immagine}
border= numero {larghezza in pixel del bordo}
height= numero {altezza in pixel}>
width= numero
{larghezza in pixel}>
Suoni
È possibile associare dei suoni alla presentazione di una pagina usando il comando <BGSOUND>
<BGSOUND
src= “ pathname del suono” | “URL del suono”
loop= “numero” | “infinite” >
Tabelle
per creare una tabella si usa il comando TABLE
<TABLE>
descrizione tabella
</TABLE>
<TABLE> ha vari attributi che servono per stabilire le caratteristiche della tabella
<TABLE
border= numero {larghezza in pixel dei bordi}
bordercolor= colore della tabella >
ad esempio, per creare la seguente tabella:
uno
1
due
2
Avrò:
<TABLE border=2>
<tr> {nuova riga}
<th> uno </th>
<th> due </th>
</tr>
<tr> {nuova riga}
<td>1</td>
<td>2</td>
</tr>
</TABLE>
<th> significa {grassetto centrato (intestazione)}
Frame
In molti casi può essere utile dividere un documento HTML in più parti, ognuna delle quali può a
sua volta contenere un documento HTML, gestibile in modo separato
IL comando FRAMESET permette di partizionare un documento attraverso una suddivisone in
righe e colonne
<FRAMESET
rows= “numero1, …, numero N”| {altezza in pixel delle righe}
“ percen1,…,percentN”, {altezza in percentuale delle righe}
* { indica il resto della pagina o la grandezza relativa}
oppure
cols= “numero1,…,numeroN” | “percent1,…,percentN” , * >
ES:
< FRAMESET rows= “50,50,80”>
<FRAMESET rows= ”20%,50%,30%”>
<FRAMESET rows= “30,*,20,20”> {la parte restante nella seconda riga}
<FRAMESET rows=”2*,*”> {la prima riga deve essere il doppio della seconda}
il comando <FRAME> si usa per indicare i frame creati con FRAMESET
<FRAME
src= ”URL” {URL associa al frame}
name= “ nome logico della pagina” {usato per i riferimenti}
scrolling=”yes”|no|”auto” {scrollbar associata al frame}
noresize {impedito resize da parte dell’utente}
marginheight=”numero”
{altezza dei margini in pixel}
marginwidth=”numero”
{larghezza dei margini in pixel}
>
Se ad es., nella colonna di sinistra ho un link e voglio visualizzare la pagina pagina.html nel frame
destro avrò:
<A HREF=”pagina.html” TARGET=”destra”>
dove “destra” è il nome logico della pagina di destra.
