Atrybut shape w HTML <area>

Tag <area> HTML

Definicja i użycie

kształt określa kształt obszaru.

kształt Atrybut Atrybut coords Razem określają rozmiar, kształt i pozycję obszaru.

Przykład

Użyj atrybutu shape, aby określić kształt każdej obszaru w mapie obrazu:

<map name="planetmap">
<area shape="rect" coords="0,0,114,576" href="sun.html" alt="Słońce">
<area shape="circle" coords="190,230,5" href="mercur.html" alt="Merkury">
<area shape="circle" coords="228,230,5" href="venus.html" alt="Wenus">
</map>

Spróbuj sam

Gramatyka

<area shape="default|rect|circle|poly">

Wartość atrybutu

Wartość Opis
default Określenie całego obszaru.
rect Zdefiniowanie obszaru prostokątnego.
circle Zdefiniowanie obszaru okrągłego.
poly Zdefiniowanie obszaru wielokątnego.

Szczegółowe wyjaśnienie:

kształt Atrybut ten służy do zdefiniowania kształtu obszaru wrażliwego na mysz w mapie obrazu:

  • okrąg (circ lub circle)
  • wielokąt (poly lub polygon)
  • prostokąt (rect lub rectangle)

kształt Wartość atrybutu wpływa na sposób interpretacji atrybutu coords przez przeglądarkę. Jeśli nie użyto kształt jeśli nie określono atrybutu, założymy, że używana jest wartość domyślna. Zgodnie ze standardem, domyślna oznacza, że obszar pokrywa całą grafikę. W praktyce, przeglądarki domyślnie używają obszaru prostokątnego, oczekując znalezienia czterech wartości coords. Jeśli nie określono kształtu i nie zawarto czterech współrzędnych w etykiecie, przeglądarka zignoruje cały obszar.

może rozpoznać kształt Przeglądarki, które oferują wartość domyślną atrybutu, mogą dostarczyć obszar obejmujący wszystkie punkty grzane, aby umożliwić kliknięcie poza zdefiniowanymi obszarami punktów grzanych. Ponieważ obszary w tagu <map> są wprowadzane w kolejności "pierwszeństwo pierwszego przybycia", wszystkie domyślne obszary muszą być umieszczone na końcu. W przeciwnym razie, domyślny obszar zastąpi wszystkie inne obszary mapy.

Przeglądarki nie mają ścisłych wymagań co do implementacji nazw kształtów. Na przykład, dla prostokąta, Netscape 4 nie rozpoznaje "rectangle", ale rozpoznaje "rect". Dlatego zalecamy używanie skróconych nazw.

Obsługa przeglądarek

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Wsparcie Wsparcie Wsparcie Wsparcie Wsparcie

Tag <area> HTML