HTML <area> coords eigenschap

HTML <area> Tag

定义和用法

coords-eigenschap definieert de coördinaten van de regio in de afbeeldingskaart. Definitie en gebruik

coords-eigenschap definieert de coördinaten van de regio in de afbeeldingskaart. Eigenschap en shape-eigenschap Gebruik samen om de grootte, vorm en positie van het gebied te specificeren.

Tip:De coördinaten van de linkerbovenhoek zijn 0,0.

Opmerking:Als de coördinaten van een area-tag overlappen met andere regio's, wordt de eerste genomen. De browser negeert coördinaten buiten de grenzen van het beeld.

Voorbeeld

Gebruik de coords-eigenschap om de coördinaten van elke regio in de afbeeldingskaart te definiëren:

<map name="planetmap">
<area shape="rect" coords="0,0,114,576" href="sun.htm" alt="Sun">
<area shape="circle" coords="190,230,5" href="mercur.htm" alt="Mercury">
<area shape="circle" coords="228,230,5" href="venus.htm" alt="Venus">
</map>

Probeer het zelf

Syntaxis

<area coords="value">

Waarde van de eigenschap

Waarde Beschrijving
x1,y1,x2,y2 Definieer de coördinaten van de linkerbovenhoek en de rechteronderhoek van het rechthoek (shape="rect").
x,y,straal Definieer de coördinaten van het middelpunt en de straal (shape="circle").
x1,y1,x2,y2,...,xn,yn

Definieer de coördinaten van de zijden van de polygoon.

Als het eerste en laatste coördinaatpaar niet hetzelfde is, voegt de browser het laatste coördinaatpaar toe om de polygoon (shape="poly") te sluiten.

Uitleg in detail:

De coords-eigenschap van de <area>-tag definieert de coördinaten van het gebied dat gevoelig is voor de muis op de clientkaart van het beeld. De cijfers en hun betekenis hangen af van de vorm van het gebied zoals bepaald door de shape-eigenschap. Het is mogelijk om een hyperlinkgebied in de clientkaart te definiëren als rechthoek, cirkel of polygoon.

Hieronder worden de juiste waarden voor elk type vorm vermeld:

Cirkel: shape="circle", coords="x,y,z"

Hier definieert x en y de positie van het middelpunt van de cirkel ("0,0" is de linkerbovenhoek van het beeld), r is de straal van de cirkel in pixels.

Polygoon: shape="polygon", coords="x1,y1,x2,y2,x3,y3,..."

Elk paar "x,y"-coördinaten definieert een hoekpunt van een polygoon ("0,0" is de linkerbovenhoek van het beeld). Ten minste drie coördinaten zijn nodig om een driehoek te definiëren; een hooggelegen polygoon vereist meer punten.

Polygoenen sluiten automatisch af, dus het is niet nodig om de eerste coördinaat opnieuw te herhalen aan het einde van de lijst om het hele gebied te sluiten.

Rechthoek: shape="rectangle", coords="x1,y1,x2,y2"

De eerste coördinaat is de hoekcoördinaat van het hoekpunt van het rechthoekige gebied, en het andere paar coördinaten is het hoekpunt van de diagonaal, "0,0" is de coördinaat van het linkerbovenhoek van de afbeelding. Let op, het definiëren van een rechthoek is een vereenvoudigde manier om een veelhoek met vier punten te definiëren.

Bijvoorbeeld, de onderstaande XHTML-code defineert een muisgevoelige gebied in de rechter onderhoek van een 100x100 pixelafbeelding en een cirkelvormig gebied in het midden van de afbeelding.

<map name="map">
  <area shape="rect" coords="75,75,99,99" nohref="nohref">
  <area shape="circ" coords="50,50,25" nohref="nohref">
</map>

Browserondersteuning

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Ondersteuning Ondersteuning Ondersteuning Ondersteuning Ondersteuning

HTML <area> Tag