Rambler's Top100
Главная / Html / Учебник по Html. Ступенька 18-ая. 

Учебник по Html для чайников. Простейшие.

Ступенька 18-ая.

С прямоугольными областями мы разобрались, теперь поговорим о других. Для начала о круглых:



Укажем тип области:


     
<map>
<area shape="circle">
</map>


Для создания круглой области нам будут нужны координаты ее центра (x и y) и длина радиуса (R) в пикселях. Т.е. порядок записи следующий:

<area shape="circle" coords="x,y,R">

Давайте, будем опять работать с геометрической областью №1. В нашем случае координаты для маленького круга будут такие: x=46, y=48; а длина радиуса - R=35. Запишем:


trimdec.ru ahi-ohi.pp.ru popa-x.org.ru boogi.pp.ru boogis.org.ru bulki-x.org.ru byfera.org.ru dashki.pp.ru kiski-boo.pp.ru love-x.pp.ru mashki.org.ru okrygna.org.ru sisuli.pp.ru tits-x.pp.ru trasa.org.ru zadok.pp.ru
     
<map>Рейтинг@Mail.ruRambler's Top100
<area shape="circle" coords="46,48,35">
</map>


Теперь, когда самое главное записано, пропишем имя карты, куда она ссылается, и привяжем карту к рисунку:


     
<img src="mapcircle.gif" usemap="#karta2">

... Куча текста и всякого содержания, или ничего...

<map name="karta2">
<area href="drugoy_document2.html" shape="circle" coords="46,48,35">
</map>


Кстати, для карты мы можем прописать атрибут alt для каждой области, сейчас у нас только одна область, но все равно, пропишем для нее alt:


     
<img src="mapcircle.gif" usemap="#karta2">

... Куча текста и всякого содержания, или ничего...

<map name="karta2">
<area href="drugoy_document2.html" shape="circle" coords="46,48,35" alt="маленький круг">
</map>


Теперь при наведении на область №1 будет всплывать подсказка. В нашем случае это будут слова "маленький круг".

Давайте, посмотрим результат (нажмите на первый круг):

маленький круг

Теперь вы самостоятельно сделаете ссылкой второй круг (x=158, y=75, R=53), чтобы закрепить пройденное. А затем следующая ступенька ждет вас.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .