地图弹窗（map pop）具体演示
<!DOCTYPE
html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml ">
<tête>
<méta http-equiv="Content-Type" content="text/html; charset=utf-8"
/>
<title>CSS实例讲解：地图提示（map pop）档</title>
<style type="text/css" media="all">
* { marge:0; remplissage : 0 ;
}
img { bordure : 0 ;
}
#show{ text-align:gauche;
}
ul { list-style-type:aucun; fond : transparent
url( ) pas de répétition -130px
0px ;
}
ul li a#map01:survol span.offset, ul li a#map01:focus span.offset, ul li
a#map01:active span.offset { margin-top:-1px; marge gauche : 230 px ;
}
ul li a#map02 { largeur:110px; hauteur : 75 px ; marge supérieure : -50 px ;
marge gauche : 235 px ;
}
ul li a#map02:hover, ul li a#map02:focus, ul li a#map02:active {
arrière-plan: transparent
url( ) pas de répétition -115px
-88px ;
}
ul li a#map03:survolez span.offset, ul li a#map03:focus span.offset,ul li
a#map03:active span.offset { margin-top:-89px; marge gauche : 245 px ;
}
ul li a#map04 { largeur:110px; hauteur : 120 px ; marge supérieure : -60 px ;
marge gauche : 5px ;
}
ul li a#map04:hover, ul li a#map04:focus, ul li a#map04:active {
arrière-plan: transparent
url( ) pas de répétition -240px
-153px ;
}
ul li a#map05:survolez span.offset, ul li a#map05:focus span.offset, ul li
a#map05:active span.offset { margin-top:-154px; marge gauche : 120 px ;
}
</style>
</tête>
<corps> <ul> <li><a id="map01"
href="#map01"><span class="offset"><img
src=" /><span>Voici la communauté de Popsville <strong>Post
Bureau</strong>, votre domicile pour les frais de port trop chers. Cliquez sur la carte pour
plus</span></span></a></li> <li><a
id="map02" href="#map02"><span class="offset"><img
src=" /><span>La maison est l'endroit où se trouve la bière. Et cela signifie que le
<strong>Dew Drop Inn</strong>. Musique live le week-end.
Cliquez sur la carte pour en savoir plus</span></span></a></li>
<li><a id="map03" href="#map03"><span
classe="décalage"><img
src=" /><span>Passez des après-midi d'été paresseux dans le magnifique
<strong>Plage de la rivière</strong>. Sortez sur la plage nudiste.
Cliquez sur la carte pour en savoir plus</span></span></a></li>
<li><a id="map04" href="#map04"><span
classe="décalage"><img
src=" /><span>Notre <strong>Woodland local
Traders</strong> est une véritable Mecque des biens de consommation et
matériel. Cliquez sur la carte pour
plus</span></span></a></li> <li><a
id="map05" href="#map05"><span class="offset"><img
src=" /><span>Vivre à la campagne signifie tuer sur la route, et le
Le <strong>Wild Game Diner</strong> le prépare avec des
sauce. Cliquez sur la carte pour
plus</span></span></a></li> </ul>
</corps>
</html>