Mappe e stili
Per creare zone attive in un'immagine si usa il tag<map>
All'interno di questo tag di definiscono delle aree con coordinate e link
Esempio d'uso
<a href="Page1.html"> <img src="Home.jpg" width="100%" title="Indice" usemap="#IndexMap"> </a> <map name="IndexMap"> <area shape="rect" coords="0,70,849,170" href="Page1.html#Tit1" title="Paragrafo 1"> <area shape="rect" coords="0,270,849,370" href="Page1.html#Tit2" title="Paragrafo 2"> <area shape="rect" coords="0,500,849,600" href="Page1.html#Tit3" title="Paragrafo 3"> <area shape="rect" coords="0,700,849,800" href="Page1.html#Tit4" title="Paragrafo 4"> </map>
Per formattare e decorare testo e immagine si usano i fogli di stili (CSS)
Esempio d'uso
.ClsContainer
{
margin: 0 auto;
overflow: hidden;
width: 850px;
background-color: #f8f6e6;
min-height: 100%;
}
.TxtColor
{
color: #2c0e10;
}
.Indent1
{
padding-right: 24px;
}
.Indent2
{
margin-left: 24px;
padding-left: 10px;
}
.ClsBold
{
font-weight: bold;
}
.ClsRosso
{
color: #ff0000;
}
...
<img src="busines_plan1.jpg" style="float:left; margin: 10px; height: 150px;">
Ecco i link ad una pagina di indice con aree attive
Esempio indice Esempio indice su JSFiddle
Ecco i link ad una pagina di esempio con uso di stili