Indice Ingegneria del Software
Corso Base al  linguaggio HTML
Le informazioni, prodotti, marchi referenziate nelle pagine seguenti rimangono di proprieta' dei rispettivi produttori, a norma delle leggi internazionali sui © copyright © non e' consentito l'uso delle stesse a scopo di lucro e/o la riproduzione senza consenso scritto
All info trademarks or product names mentioned herein are the property of their respective owners
 
Informazioni, chiarimenti, discussioni at Contact point Giovanni.Secondulfo@inwind.it  

Indice Generale:

Introduzione all'HTML

HTML (HyperText Markup Language) come la gran parte delle applicazioni SGML (Standard Generalized Markup Language )) è un linguaggio che supporta l’ utente nella creazione di documenti ipertestuali che siano trasportabili da una macchina ad un’ altra, cioè tali da risultare indipendenti sia dall' hardware che dal Sistema Operativo; lo si puo' considerare il linguaggio standard per il WWW .
Questo linguaggio è fondamentalmente caratterizzato da tags che non sono altro che delle funzioni che agiscono su determite porzioni di testo; Queste funzioni racchiudono, come marcatori,  delle porzioni di file testuale (file ASCII a 7-bit), e comunicano al client ( Mosaic, Netscape, ... ) il tipo di oggetto racchiuso ( i.e. immagini e come visualizzarlo ).
Le tags ( o specifiche di formattazione ) sono contenute nelle angle brackets .

i. e. <title>Prova</title>

In questo caso le tags sono <title> (start tag) e </title> (end tag) (generalizzando <nome tag> testo coinvolto </nome tag>), il testo compreso viene detto contenuto; la end tag è sempre preceduta dallo slash.
Esiste anche la categoria delle tags empty le quali non hanno contenuto e sono di fatto caratterizzate solo da una start tag.
i.e. <isindex> ( tale tag definisce il file corrente come indice di ricerca).
E' possibile omettere L'end tag quando vi è una sequenza di elementi uguali tipo
<li>list item
<li> list item2 </li>
piuttosto che :
<li> list item </li>
<li> list item2 </li>
E' bene in ogni caso non abusare delle omissioni in quanto ambienti non completamente standard possono non garantire un comportamento corretto.
Le specifiche di formattazione del testo, tag , possono essere date sia in maiuscolo che in minuscolo (cioe` e' equivalente scrivere <P> o <p> come lo e' <TITLE> con <TitLe>).

I documenti HTML vengono caratterizzati e riconoscuti dal suffisso ".html".

L'HTML utilizza quelli che sono chiamati "Uniform Resource Locators" (URL) per rappresentare i link ipermediali e i link ai servizi di rete all'interno dei documenti. E' possibile rappresentare ogni file o servizio in Internet con un URL.
 

Torna all'Indice Generale  

Elementi base di un testo in formato HTML

Requisiti minimi di un documento HTML

La prima parte di un file HTML è costituita dal File Header. Qui vengono specificati titolo del documento ed il link con l'estensore/manutentore del file. L'header è seguito dal body che risulta essere tutto quello che si vuole visualizzare.
Il documento minimo in HTML e` composto da : La struttura di un doc HTML è tipicamente la seguente :

 <HTML>
<HEAD>
<title>doc HTML </title>
<link rev="made" href="mailto:Giovanni.Secondulfo@inwind.it">
</HEAD>
<BODY>
il testo del doc con i vari paragrafi, link ecc.
</BODY>
</HTML>

  Torna all'Indice Generale

Title

Ogni documento HTML dovrebbe avere un titolo che ne descriva il contenuto. Il titolo e' usato principalmente per identificare il documento (p.es. quando si cerca un documento nella Hotlist) ed e' in genere visualizzato separatamente dal resto del documento. Ovvia conseguenza del fatto che un titolo serve a identificare il documento, se il titolo esiste deve essere unico.

 Va all'indice generale

 

Header

In generale, anche per ragioni di leggibilita', un documento puo' essere diviso in sezioni, ognuna delle quali con il suo specifico titolo (heading). il linguaggio HTML permette fino a sei livelli di "section heading", referenziati con gli identificativi da  <h1> a <h6>. I programmi client (browsers) normalmente mostrano diverse grandezze colori e posizioni in funzione dell'heading preselto. Vengono di seguito riportati alcuni esempi :

<h1>Heading Tipo H1 </h1> con il seguente effetto

Heading Tipo H1

<h2>Heading Tipo H2 </h2> con il seguente effetto

Heading Tipo H2

<h3>Heading Tipo H3 </h3> con il seguente effetto

Heading Tipo H3

<h4>Heading Tipo H4 </h4> con il seguente effetto

Heading Tipo H4

<h5>Heading Tipo H5 </h5> con il seguente effetto
Heading Tipo H5
<h6>Heading Tipo H6 </h6> con il seguente effetto
Heading Tipo H6
La grandezza delle parole per effetto degli Header varia in funzione dei font. In particolare con alcuni font e' possibile che gli Header dal 5 al 6 vengono visualizzati piu' piccoli del testo normale.

Va all'indice generale

 

Paragraph

L'elemento piu' comune di un documento HTML e' il paragrafo; nella maggior parte dei browsers e' accettato l'uso <p> senza la specifica end-tag </p>; in ogni caso e' bene  utilizzare la struttura completa per racchiudere i paragrafi. Ad esempio :
<body>
<p> Questo e' un esempio di paragrafo </p>
</body>
Si possono avere piu' paragrafi consecutivi, ogniuno racchiuso dentro le proprie tags <p>  ... </p>.
Non si possono usare linee bianche per separare i paragrafi, non vengono riconosciuti i blank multipli, i tabs o le interruzzioni di linea (Carriage Return),  cosa invece che avviene normalmente nei word-processor. Quindi attenzione a quando si edita un testo perche', se ad esempio finite una frase in mezzo ad una riga e mettete un punto ed andate a capo, quello che scriverete nella riga seguente apparira` subito dopo il punto. L'HTML inoltre adotta il word-wrapping, cioe` ridimensionando la finestra in cui il documento appare, il testo viene scalato di conseguenza per permetterne la visione integrale.
E' possibile definire l'impostazione di un paragrafo utilizzando l'attributo ALIGN di seguito si riporta un esempio di tali impostazioni :
<p align=center> ....... </p>
dove i valori di align possono essere center, left e right .
In questo costrutto di impostazione e' obbligatoria la end tag </p>.

 Va all'indice generale

Commenti

E' possibile, a scopo documentativo del sorgente HTML, inserire dei commenti, tali stringhe ovviamente sono visibili solo a livello di editing del file; il commento puo' essere posto su piu' linee.
Si riporta di seguito la sintassi di un commento
<!-- Questo e' un commento
tale stringa e' invisibile quando il file e' trattato dal browser.-->

 Va all'indice generale 

Link

Introduzione

I links sono le entita' che consentono la creazione di un ipertesto W3. Cliccando su una frase o una parola opportunamente evidenziata (il tipo di videnziazione colore, tipo di carattere, sottolineatura dipende dal browser che si sta utilizzando) viene mostrato il file ad essa collegata. Il referenziamento deve essere esplicito a cura del redattore del file; per referenziare un file basta che questo sia disponibile su un qualsiasi server di Internet. Il file puo' essere di un tipo qualsiasi accedibile tramite Gopher, WAIS, Usenet News, anonimus ftp, telnet, finger e qualsiasi altro servizio venga reso disponibile.
La tag del link e' chiamata anchor (ancora) abbreviato in "a" in quanto puo' agire sia da salto all'interno di uno stesso file che puntare come obiettivo ad un'altro link. Il nome file o il servizio offerto e' quello specificato fra le virgolette ed e' comunemente denominato Uniform Resource Locator (URL).
 Il Tag da usare e':

 <A HREF ="file_name"( in formato URL)> testo che fungera' da collegamento </A>
 

 Va all'indice generale

Formato URL

La sintassi di un indirizzamento e' del tipo :
<a href="Risorsa://Host.Domain[:Port]/path/filename">testo</a>
dove l'URL (racchiuso tra virgolette e' composto da) :
Risorsa scelta fra i seguenti :
http = file di tipo W3 ipertesto ( tutti quei files che hanno come suffisso .html)
file = per ttutti i tipi di files non di tipo html. Se il file e' locale si puo' omettere la dicitura file e specificare direttamente il
        path assoluto o relativo.
gopher = per il retrivial di un file tramite un directory-browser Gopher
WAIS = per il retrivial di un file tramite un directory-browser WAIS
news = per Usenet news (news server)
telnet = per il retrivial dei file tramite servizi di tipo login su sistemi remoti
ftp = per il retrivial dei file tramite servizi di tipo anonymus ftp
mailto = Per inviare mail ad uno specificato indirizzo
( Il nome della risorsa e' seguito da un due punti ed un doppio slash )
Host.Domain = Indirizzo Internet dove il file e' localizzato  (ad esempio inwind.it l'idirizzo puo' anche essere invece che
                        simbolico di tipo IP tipo 138.132.102.96)
Port = Indica la porta su cui il servizio e' offerto, si puo omettere se il servizio richiesto e' di http (port number 80), in caso contrario andra' specificato di seguito all'hostname ( i.e. inwind.it:8080)
path/filename = Specifica completa del file che si vuole puntare, la sua omissione produce la visualizzazione del top level file.

Vi sono alcune eccezioni : news necessita di due punti e del nome del newsgroup, usera' il server definito localmente per eseguire la ricerca; con gli script dei server Gopher, WAIS e HTTP, e' possibile far seguire il filename da un punto interrogativo e da una stringa e quest'ultima verra' utilizzata come chiave di ricerca. Con files di tipo HTTP si puo far seguire il nomefile dal simbolo # e da una specificata tag anchor questo consentira il puntamento all'interno del documento e non semplicemente dall'inizio ( ad esempiocon  #p2.1 si punta a questa sezione ).
Esistono anche file di tipo script server realizzati da alcuni HTTP server, permettono tramite l'URL di puntare ad un programma in modo che venga eseguito e non ricercato. Tali script producono un output valido solo in HTML  visualizzabile in una schermata del browser. ad esempio l'implementazione di mappe sensibili e di form avviene con questo metodo.
Per i file locali e' opportuno usare sempre path relativi (in caso di spostamenti danno meno problemi).

Riassumendo: la prima parte dell'URL (prima delle due sbarre (//)) specifica il metodo di accesso. La seconda e' tipicamente l'indirizzo dove sono locati il computer, i dati o i servizi richiesti. Le parti successive specificano gli eventuali nomi di file, di porte di connessione o il testo da cercare in un database.
 

Va all'indice generale

 

Ancore e Links

Si riportano di seguito i principali attributi per una tag anchor

HREF
Questo attributo imposta l'anchor come un sensitive text. Se selezionato produce il salto o il collegamento ad altro documento

NAME
La presenza di questo attributo permette all'anchor di essere destinazione del link, il valore dell'attributo e' l'identificatore dell'anchor.

REL
Definisce le relazioni descritte da un link ipertestuale

REV
Utilizzabile per definire una relazione similmente a REL ma in direzione opposta; cioe' se  REL="X" esprime una relazione fra A e B REV="X" esprime la stessa relazione fra B e A.

TITLE
Di tipo informativo, il suo valore deve eguagliare il titolo del documento collegato. Il link puo' trasportare l'attributo ad esempio per visualizzarlo ancor prima di aver ricevuto il documento nella sua intierezza.

METHODS
Il valore e' una stringa che deve risultare una lista HTTP Methods separata da virgole.

 Va all'indice generale

 

Image

E' possibile visualizzare immagini JPG e GIF all'interno di un documento HTML (si ritiene sconsigliabile l'utilizzo di immagini BMP in quanto possono essere portatori di virus ed inoltre occupano piu' spazio). Ogni immagine richiede un certo tempo di caricamento causando un rallentamento nella visualizzazione del  documento.
Le immagini possono essere incluse in un qualsiasi punto del documento; l'invocazione sintattica e' la seguente tag :

<IMG SRC="...." ALIGN="....." ALT="....." WIDT=n HEIGTH=m>

Trattasi di una empty tag; gli attriburi della tag risultano:
SRC specifica L'URL dell'immagine che si vuole visualizzare, la sintassi dell'URL ovviamente e' quella specificata in precedenza.
ALIGN specifica l'allineamento rispetto alla pagina. I valori possibili sono

top, bottom, middle, left, right,  center .

I primi tre attributi  determinano l'allineamento dell'immagine rispetto al testo riportato in precedenza. L'impostazione di default e' costituita da BOTTOM, in generale non viene mutata la posizione del testo, i rimanenti tre attributi definiscono il posizionamento dell'immagine rispetto alla pagina.
ALT E' un'informazione orientata ai browser non grafici  che non potendo visualizzare l'immagine definiscono un puntatore [IMAGE] dove il puntatore verrebbe visualizzato.
Un utilizzo del costrutto alt="...."  e' quello di specificare del testo al fine di identificare l'immagine stessa, l'impostazione a null di questo attributo (alt="") impone ai browser non grafici di non visualizzare nulla neanche  [IMAGE].
ISMAP : Definisce l'iimagine come mappa sensibile
WIDTH e HEIGHT : Determinano le dimensioni dell'immagine in pixel.
E' possibile usare, in generale, qualsiasi tipo di formato immagine pero' possono non essere supportati dai browser pertanto e' opportuno usare i tipi espressi in precedenza.

E' possibile usare anche la tag FIG molto piu' efficiente della IMG con un costrutto del tipo :
<FIG ALIGN="......" src="....">........</FIG>
Questo costrutto si comporta come un paragrafo al suo interno e' possibile specificare un titolo per l'immagine
<caption>........</caption> e qualsiasi altro elemento costituente il paragrafo
l'attributo ALIGN oltre ai valori precedenti può assumere anche il valore di FLOAT in questo caso le caratteristiche di visualizzazione  saranno a cura del browser.
 

 Va all'indice generale

 

Immagini, Suono ed Animazioni

All'interno di un documento HTML possono essere inclusi vari tipi di file (audio, animazioni, ... ). I formati permessi sono quelli supportati dal browser la sintassi dell'inclusione di un file e' la stessa di quella delle immagini come di seguito riportata :
<img src="audio.wav"> o anche
<a href="audio.wav">audio</a> o generalizzando
<A HREF ="Image_URL"> link anchor </A>
La differenza fra il costrutto IMG SRC e quello di tipo HREF sta nel fatto che quest ultimi  sono  delle anchor e quindi verranno richiamati se e solo se si verifica l'evento click sull'oggetto; questa politica ha l'indubbio vantaggio di non rallentare la visualizzazione del documento stesso, i primi invece sono parte integrante del documento HTML e quindi vengono caricati contestualnmente con il documento, in verita' i browser comunque effettuano delle politiche di caricamento partendo dal testo seguito dalle immagini e quindi dai files audio; fermo restando che il caricamento del documento HTML non puo' ritenersi concluso se non quando e' stato scaricato in tutte le sue componenti.

Il riconoscimento del formato del file a cui il link si riferisce viene effettuato tramite le estensioni stesse del file.

Le piu' comuni estensioni sono:

Attenzione: assicurarsi che il browser  abbia le applicazioni server  necessarie per gestire i vari formati utilizzati.

Va all'indice generale
 

Tabelle

Esiste un opportuno tag per la definizione di una tabella la sintassi di questo tags e' riportata di seguito :

<TABLE BORDER COLS=n WIDTH="mm%" >
<TR>
<TD>&nbsp;
<BR></TD>

<TD>&nbsp;
<BR></TD>
.
.
.
</TR>
</TABLE>
Ghi attributi di tale tag sono :
BORDER implica il disegno dei bordi
COLS "n" definisce il numero delle colonne costituenti la tabella
WIDTH "mm%" definisce la dimensione della tabella in relazione alla dimensione della window visualizzabile
come attributo esterno si possono utilizzare left, right,  center al fine di definire il posizionamento della tabella relativamente alla window visualizzata.
TH definisce le voci della tabella,
TD definisce le righe della tabella,
TR definisce il separatore di riga,
Gli end tags sono obbligatori (</TD>, </TR>, </TABLE>)
Si riporta di seguito un esempio di tabella

<TABLE BORDER COLS=3 WIDTH="50%" >
<TR>
<TD>prima colonna&nbsp;
<BR>p col seconda riga</TD>

<TD>seconda colonna&nbsp;
<BR>s col seconda riga</TD>

<TD>terza colonna&nbsp;
<BR>t col seconda riga</TD>
</TR>
</TABLE>

Il cui effetto e' riportato di seguito
 
prima colonna 
p col seconda riga		 seconda colonna 
s col seconda riga		 terza colonna 
t col seconda riga

Va all'indice generale

Liste

Introduzione

Una lista e' una sequenza di paragrafi ognuno dei quali deve essere preceduto da una tag particolare.  Il formato HTML mette a disposizione 5 Tag per definire delle liste : ordinate, non-ordinate, discorsive, menu' e directory..

 

Liste Ordinate

Una lista ordinata e' identificata dalla tag <OL> Un esempio di lista ordinata e' il seguente :

<OL>
<li>Primo Elemento</li>
<li>Secondo Elemento</li>
<li>Terzo Elemento</li>
<li>Quarto Elemento</li>
<li> Lista all'interno di una lista
        <OL>
        <li>Primo Oggetto</li>
        <li>Secondo Oggetto</li>
        <li>Terzo Oggetto</li>
        <li>Quarto Oggetto</li>
        </OL>
</OL>
La presenza dell 'end-tag </li> non e' obbligatoria per ogni elemento della lista, e' buona norma comunque non ipotizzare alcun comportamento degli interpreti e pertanto e' opportuno definire la chiusura esplicita sull'elemento di lista.
L'effetto prodotto dal codice precedente e' il seguente :
 

  1. Primo Elemento
  2. Secondo Elemento
  3. Terzo Elemento
  4. Quarto Elemento
  5. Lista all'interno di una lista
    1. Primo Oggetto
    2. Secondo Oggetto
    3. Terzo Oggetto
    4. Quarto Oggetto
Sia le liste ordinate che quelle non ordinate vengono visualizzate indentate di qualche spazio rispetto al testo normale ed un carattere particolare viene messo prima degli elementi della lista. Per le liste ordinate si ha la numerazione con un progressivo, tale numerazione e' automatica cosi come e' automatico il riaggiornamento a seguito di inserimento o rimozione di elementi di lista.
 

 

Liste Non-Ordinate

Una lista non-ordinata e' strutturata a forma di elenco puntato . E' possibile utilizzarle laddove la sequenza degli oggetti non e' importante, in questo caso il Tag per aprire le liste non-ordinata e' : <UL>, per chiuderla </UL>, e per inserire gli oggetti della lista il Tag e' sempre: <LI>

Un esempio di lista ordinata e' il seguente :

<UL>
<li>Primo Elemento</li>
<li>Secondo Elemento</li>
<li>Terzo Elemento</li>
<li>Quarto Elemento</li>
<li> Lista all'interno di una lista
        <UL>
        <li>Primo Oggetto</li>
        <li>Secondo Oggetto</li>
        <li>Terzo Oggetto</li>
        <li>Quarto Oggetto</li>
        </UL>
</UL>
  Un esempio di lista Non-Ordinata e' riportata di seguito :
 

Una lista puo' essere inserita all'interno di un paragrafo, o fra due paragrafi, E' possibile avere un paragrafo all'interno di una lista. A esempio:

<UL>
<li> Primo oggetto</li>
    <p> Secondo paragrafo appartenente allo stesso oggetto.
</p><li>Altro Oggetto</li>
</UL>

Che produce il seguente effetto :

Tale strutturazione non e' pero garantita su tutti i browser.
Le liste ordinate e non possono essere caratterizzate dall'attributo compact che puo' essere interpretato, dalla maggior parte dei browser, come idicatore di oggetti di lista corti, in modo tale da ridurre lo spazio tra gli oggetti. L'attributo va inserito nella angle brackets dopo il tag. Ad es
<ULcompact>.
Se si utilizza la struttura per l'elemento di lista:

<li src="......">

si ha la possibilita' di sostituire la numerazione o il bullet della lista con una specificata immagine identificata dall'attributo SRC="...." .

Liste di menu

Il Tag per aprire le liste di menu e' : <MENU>, per chiuderla </MENU>, e per inserire gli oggetti della lista il Tag e' sempre: <LI>
Questo tipo di lista dovrebbe essere fatta di piccoli paragrafi (solitamente 1 linea per elemento). Essa viene visualizzata con uno stile piu' compatto rispetto alle liste non ordinate.

 

Liste di directory

Il Tag per aprire le liste di directory e' : <DIR>, per chiuderla </DIR>, e per inserire gli oggetti della lista il Tag e' sempre: <LI>
Questo tipo di lista dovrebbe essere composta di piccoli elementi, tipicamente di 20 caratteri. Questi possono essere incolonnati lungo la pagina.

 

Liste Discorsive

Le liste discorsive sono designate per gestire i casi in cui l'oggetto di una lista ha alcuni paragrafi di spiegazione
Una lista di descrizione e' solitamente un alternanza di titoli (DT e descrizioni (DD).
  1. Si apre la lista con il Tag <DL>.
  2. Si inserisce il titolo del primo oggetto della lista dopo il Tag <DT>.
  3. Si inserisce la descrizione del corrispondente oggetto dopo il Tag <DD>(iterare a piacere i punti 2 e 3).
  4. Si inserisce il Tag di chiusura lista </DL>.
Attenzione: sono ammesse liste nidificate di qualsiasi livello; l'output risultante pero' varia a seconda del browser usato (alcuni non le supportano).

Un esempio di lista discorsiva e' riportato di seguito :
<DL>
    <DT>Primo Termine</DT>
    <DD>Paragrafo Descrittivo del Termine. Possono essercene piu' di uno</DD>
    <DT>Secondo Termine</DT>
    <DD>Paragrafo Descrittivo del Secondo Termine. Possono essercene piu' di uno
</DD>
</DL>

Il risultato visuale e' il seguente :

Primo Termine
Paragrafo Descrittivo del Termine. Possono essercene piu' di uno
Secondo Termine
Paragrafo Descrittivo del Secondo Termine. Possono essercene piu' di uno
 Va all'indice generale 

Formattazione del testo

Si presentano di seguito alcune nozioni sulla mutazione dell'aspetto visuale di un documento. E' bene ribadire che queste features sono attivabili solo su browser con capacita' grafiche, ed in ogni caso l'effetto finale puo' dipendere dal browser stesso, per browser non a capacita' grafiche e' invalso l'uso di sottolineare il testo o racchiudere il testo fra asterischi.

Testo preformattato

Il Tag <PRE>testo_da_visualizzare</PRE> permette di visualizzare del testo all'interno di un documento HTML esattamente come e' stato battuto con le indentature, gli spazi e le linee vuote. Questa opzione risulta comoda per importare interi pezzi di testo (es. un listato di un programma) ma ha un inconveniente: molti Tag non vengono interpretati correttamente all'interno di un testo preformattato.

 Va all'indice generale

 

Formato dei caratteri

Singole parole o intere frasi possono essere messe in risalto tramite l'uso di speciali Stili. L'HTML supporta due tipi di Stili: quello logico e quello fisico. Il formato logico da uno stile al testo a cui si riferisce in accordo con il suo significato (quello del tag) e puo' variare da browser a browser. I due tipi di stile sortiscono lo stesso effetto, ma quello logico sarebbe da preferire in caso di future modifiche e nell'eventualita' che si possano introdurre nuovi tipi di stili.

 Stile fisico.

 Lo stile fisico supporta:

Italico.
Si ottiene con <I>parola_o_frase</I>.
Grassetto o Bold.
Si ottiene con <B>parola_o_frase</B>.
Sottolineato (non sempre supportato).
Si ottiene con <U>parola_o_frase</U>.
Lampeggiante
Si ottiene con <BLINK>parola_o_frase</BLINK>una parola_o_frase lampeggiante, tale effetto a volte puo' risultare un po' noioso
Stile logico

 

Le tags di evidenziazione esposte in precedenza necessitano sempre della tag di chiusura </tag>

Va all'indice generale

 Sequenze di Escape e altri Tag

 Qui di seguito vi sono alcune escape sequence per inserire caratteri particolari (quali >,&, ecc.) che altrimenti verrebbero considerati come facenti parte di Tag:

Attenzione: le sequenze di escape sono "case sensitive" cioe' vi e'differenza nell'usare un carattere in minuscolo dall'usarlo in maiuscolo .

Altre sequenze di escape esistono per caratteri accentati e con l'umlaut tedesco

 Il Tag Blockquote serve a avere un pezzo di testo (ad es. una citazione) in modo indentato e separato rispetto al resto del testo. L'invocazione e' del tipo :
<BLOCKQUOTE> Testo_coinvolto </BLOCKQUOTE>
(all'interno sono ammessi i Tag per i paragrafi).

 Il Tag Address serve generalmente per specificare l'autore del documento html ed eventualmente il suo recapito mail ecc. (solitamente si trova alla fine del documento). L'invocazione e' del tipo:
<ADDRESS> Testo_coinvolto </ADDRESS>.

 Va all'indice generale

Colori
E' possibile la definizione del colore sia per quanto attiene la parte scritta che per quanto riguarda i singoli sfondi.
la sintassi dell'invocazione del cambio colore e' la seguente :

<BODY bgcolor="xxxxxx" text="xxxxxx"link="xxxxxx" vlink="xxxxxx" alink="xxxxxx">

dove le stringhe xxxxxx identificano la rappresentazione esadecimale dei colori :
White (bianco)= FFFFFF
Yellow (giallo)= FFFF66
Red (rosso)= FF0000
Grey (grigio) = CCCCCC
Blue (blu)= 0000FF
Green (verde)= 00FF00
Black (nero) = 000000
Purple (porpora)= CC33FF
Lt. Blue (blu chiaro)= 00CCFF

bgcolor e' il colore dello sfondo
text e' il colore del testo
link e' il colore di un link non visitato
vlink e' il colore di un link visitato
alink e' il colore di un link quando questo viene tenuto pigiato

E' possibile avere anche un'immagine come colore di fondo, tale attribuzione si ottiene semplicemente sostituendo l'attributo BGCOLOR del BODY con BACKGROUND; ad esempio volendo avere come sfonfo l'immagine "fondo.gif" la sintassi risultera' :
<BODY BACKGROUND="fondo.gif">
L'immagine "fondo.gif" deve risiedere nel direttorio corrente altrimenti va specificato il path assoluto.
 
Va all'indice generale

Effetti Vari

Esistono alcune semplici tags atte a rendere piu' gradevole la visualizzazione di una pagina senza nel contempo appesantire la presentazione della pagina; queste tags sono definite empty tags nel senso che non prevedono la end-tag.

Interruzione di riga

<BR>
Una struttura del tipo :
riga1<BR>rigadue produce l'effetto :
  riga1
rigadue

Visualizzazione di Riga Orizzontale

<HR> Con il seguente effetto : 

Piu' propriamente la sintassi di visualizzazione di una riga orizzontale e' riportata di seguito :

<HR size=n align="....." width="n%">

L'attributo size indica la dimensione della linea
L'attributo width indica la lunghezza della linea espressa in termini percentuali (100% tutto schermo)
L'attributo align ne definisce l'allineamento (possibili valori right, left, center)
L'attributo noshade serve a riempire la linea con il nero

Ad esempio la tags :
<hr size=10 align=right noshade width=50%>
produce l'effetto : 

Altri tipi di linee che si ritrovano belle pagine Web non sono tags ma delle immagini.

Negazione dell'interruzione di linea
Tale tags serve ad evitare che il browser possa definire l'interruzione di linea dopo un particolare punto; a tale scopo si usa la tags <NBSP> fra due parole senza spazio.

parola1<nbsp>parola2
 

Va all'indice generale

Informazioni, chiarimenti, discussioni at Contact point Giovanni.Secondulfo@inwind.it  
Indice Ingegneria del Software
This page hosted by GeoCities
1