地图弹窗(всплывающая карта)具体演示
<!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 ">
<голова>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"
/>
<title>CSS实例讲解:地图提示（всплывающая карта）档</title>
<style type="text/css" media="all">
* { маржа:0; дополнение: 0;
}
img { граница: 0;
}
#show {выравнивание текста: влево;
}
ul {тип списка-стиля: нет; фон: прозрачный
URL( ) без повтора -130px
0 пикселей;
}
ul li a#map01:hover span.offset, ul li a#map01:focus span.offset, ul li
a#map01:active span.offset {margin-top:-1px; поле слева: 230 пикселей;
}
ul li a#map02 { width:110px; высота: 75 пикселей; поле-верх:-50 пикселей;
поле слева: 235 пикселей;
}
ul li a#map02:hover, ul li a#map02:focus, ul li a#map02:active {
фон: прозрачный
URL( ) без повтора -115px
-88 пикселей;
}
ul li a#map03:hover span.offset, ul li a#map03:focus span.offset,ul li
a#map03:active span.offset {margin-top:-89px; поле слева: 245 пикселей;
}
ул ли a#map04 {ширина:110px; высота: 120 пикселей; поле-верх:-60 пикселей;
поле слева: 5 пикселей;
}
ul li a#map04:hover, ul li a#map04:focus, ul li a#map04:active {
фон: прозрачный
URL( ) без повтора -240px
-153 пикселей;
}
ul li a#map05:hover span.offset, ul li a#map05:focus span.offset, ul li
a#map05:active span.offset {margin-top:-154px; поле слева: 120 пикселей;
}
</стиль>
</голова>
<body> <ul> <li><a id="map01"
href="#map01"><span class="offset"><img
src=" /><span>Это сообщество Попсвилля <strong>Опубликовать
Офис</strong> — ваш дом с завышенными ценами на почтовые расходы. Нажмите на карту, чтобы
подробнее</span></span></a></li> <li><a
id="map02" href="#map02"><span class="offset"><img
src=" /><span>Дом там, где пиво. А это значит, что
<strong>Таверна «Капля Росы»</strong>. Живая музыка по выходным.
Нажмите на карту, чтобы увидеть больше</span></span></a></li>
<li><a id="map03" href="#map03"><span
class="offset"><img
src=" /><span>Проведите ленивые летние дни в прекрасном
<strong>Ривер-Бич</strong>. Потусуйтесь на нудистском пляже.
Нажмите на карту, чтобы увидеть больше</span></span></a></li>
<li><a id="map04" href="#map04"><span
class="offset"><img
src=" /><span>Наш местный <strong>Вудленд
Трейдеры</strong> — настоящая Мекка товаров народного потребления и
аппаратное обеспечение. Нажмите на карту, чтобы
подробнее</span></span></a></li> <li><a
id="map05" href="#map05"><span class="offset"><img
src=" /><span>Жить в деревне — значит убивать на дорогах, а
<strong>Wild Game Diner</strong> готовит его со специальными
соус. Нажмите на карту, чтобы
подробнее</span></span></a></li> </ul>
</тело>
</html>