lezioni sui siti web. prof.Romei Michele
<body>
Molti
gli attributi associabili a questo
tag:background,bgcolor,link, vlink, alink, text
Evidenziati
in giallo gli attributi proprietari di singoli browser dei quali se
ne sconsiglia
l'utilizzo:
bgproperties, topmargin, bottommargin, leftmargin, rightmargin.
</body
Si
inseriscono lasciando uno spazio vuoto fra la scritta body e
la sua chiusura > Gli
attributi possono essere più di uno e specificati uno di
seguito all'altro.
Un esempio di dichiarazione dell'intero
body con attributi ad esso associabili.
<body background="sfondo.gif" text="#0000ff" marginwidth="2">
Deprecato. Lo stesso esempio con una dichiarazione di style.
<style
type="text/css">
body {
background-image:
url("sfondo.gif");
color: #0000ff;
margin:
2px;
}
</style>
background
L'attributo background permette
di adoperare un'immagine grafica come sfondo della pagina. Questa
immagine dovrà essere di tipo .gif .jpg o .png.
Indipendentemente dalle dimensioni verrà usata a riempimento
di tutta la finestra del browser a prescindere dalla dimensione e
risoluzione del video.
<body background="nome_immagine.gif">
E' possibile richiamare l'immagine anche da altro sito, specificandone l'indirizzo completo (URL)
<body background="http://www.nome_sito.it/nome_immagine.gif">
Entrambi deprecati a favore di una dichiarazione di style in linea, nella pagina o su foglio esterno:
<style
type="text/css">
body { background-image:
url("nome_immagine.gif"); }
</style>
bgproperties
L'attributo bgproperties fissa
l'immagine (fixed) adoperata come sfondo, in pratica questa resta
ferma durante lo spostamento verticale (scrolling) della pagina,
dando l'impressione di far scivolare
sullo sfondo le immagini ed i testi. Attributo proprietario
di alcuni browser non riconosciuto dal W3C.
<body background="nome_immagine.gif" bgproperties="fixed">
Deprecato, meglio usare una dichiarazione di style, in linea o su foglio esterno:
<style
type="text/css">
body { background-attachment:
fixed; }
</style>
bgcolor
L'attributo bgcolor si
adopera per colorare lo sfondo della pagina con una tinta unita, il
colore può essere espresso col nome inglese o con il codice
esadecimale corrispondente. A questo proposito suquesta
pagina è
possibile vedere 140 colori di base con relativo nome e codice
esadecimale.
<body bgcolor="green">
oppure
<body bgcolor="#006600">
Deprecati, meglio usare una dichiarazione di style, in linea o su foglio esterno:
<style
type="text/css">
body { background-color:
#006600;}
</style>
La notazione esadecimale # è da preferirsi, in quanto permette con estrema semplicità di poter scegliere fra una tavolozza di ben 16 Mil. di colori.
link
L'attributo link si
adopera per assegnare il colore dei links facenti parte della pagina,
può essere espresso sia col nome inglese che col relativo
codice esadecimale. A questo proposito su questa
pagina è
possibile vedere 140 colori di base con relativo nome e codice
esadecimale.
<body link="green">
oppure
<body link="#006600">
Deprecati, meglio usare una dichiarazione di style, in linea o su foglio esterno:
<style
type="text/css">
a:link { color: #006600;
}
</style>
La notazione esadecimale è da preferirsi, in quanto permette con estrema semplicità di poter scegliere fra una tavolozza di ben 16 Mil. di colori. Per default questo colore è blu (blue) #0000ff
vlink
L'attributo vlink si
adopera per assegnare il colore dei links già visitati
all'interno della stessa pagina, può essere espresso sia col
nome inglese che col relativo codice esadecimale. A questo proposito
suquesta
pagina è
possibile vedere 140 colori di base con relativo nome e codice
esadecimale.
<body vlink="red">
oppure
<body vlink="#ff0000">
Deprecati, meglio usare una dichiarazione di style, in linea o su foglio esterno:
<style
type="text/css">
a:visited { color: #ff0000;
}
</style>
La notazione esadecimale è da preferirsi, in quanto permette con estrema semplicità di poter scegliere fra una tavolozza di ben 16 Mil. di colori. Per default questo colore è porpora (purple) #800080
alink
L'attributo alink si
adopera per assegnare il colore dei links attivi, colore che cambia
nel momento del click su di esso, può essere espresso sia col
nome inglese che col relativo codice esadecimale. A questo proposito
su questa
pagina è
possibile vedere 140 colori di base con relativo nome e codice
esadecimale.
<body alink="green">
oppure
<body alink="#006600">
Deprecati, meglio usare una dichiarazione di style, in linea o su foglio esterno:
<style
type="text/css">
a:active { color: #006600;
}
</style>
La notazione esadecimale è da preferirsi, in quanto permette con estrema semplicità di poter scegliere fra una tavolozza di ben 16 Mil. di colori. Per default questo colore è rosso (red) #ff0000
text
L'attributo text si
adopera per assegnare il colore del testo nella pagina, può
essere espresso sia col nome inglese che col relativo codice
esadecimale. A questo proposito su questa
pagina è
possibile vedere 140 colori di base con relativo nome e codice
esadecimale.
<body text="green">
oppure
<body text="#006600">
Deprecato, meglio usare una dichiarazione di style, in linea o su foglio esterno:
<style
type="text/css">
body { color: #006600;
}
</style>
La notazione esadecimale è da preferirsi, in quanto permette con estrema semplicità di poter scegliere fra una tavolozza di ben 16 Mil. di colori. Per default questo colore è rosso (red) #ff0000
xxxmargin
Gli
attributi: topmargin, bottommargin, leftmargin, rightmargin servono
per definire la distanza in pixel dei contenuti rispetto ai margini
della pagina e si riferiscono rispettivamente dal: margine superiore,
margine inferiore, margine sinistro e margine destro. Un margine
uguale a zero farà si che il testo inizi praticamente sul
bordo della finestra del browser.
Attributo proprietario
di alcuni browser non riconosciuto dal W3C.
<body topmargin="30" bottommargin="25" leftmargin="15" rightmargin="15">
Deprecato, meglio usare una dichiarazione di style, in linea o su foglio esterno:
<style
type="text/css">
body { margin: 30px 15px 25px
15px;}
</style>
Oppure dovendone modificare uno solo:
<style
type="text/css">
body { margin-top:
30px;}
</style>
ESEMPIO
Riassumendo,
questa sotto potrebbe essere una definizione tipo del corpo (body),
di una pagina che abbia uno sfondo come riempimento che resti fisso
durante le operazioni di spostamento (scrolling), con un testo di
colore nero, i links di colore rosso, i links visitati di colore
verde, il tutto con una distanza dai quattro margini di 50 pixel.
<body background="nome_immagine.gif" bgproperties="fixed" text="black"
link="red" vlink="green"topmargin="50" bottommargin="50" leftmargin="50" rightmargin="50">
Deprecato!, meglio usare una dichiarazione di style, in linea o su foglio esterno:
<style
type="text/css">
body {
background-image:
url("nome_immagine.gif");
background-attachment:
fixed;
color: black;
margin: 50px;
}
a:link { color:
red; }
a:visited { color: green;}
</style>