English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
在<a>元素中使用shape和coords属性来创建图像映射:
<!doctype html> <html> <head> <title>html: <a> coords 属性的使用 - 基础教程(oldtoolbag.com)</title> </head> <body> <p>点击图片中的太阳或附近的行星:</p> <object data="planets.gif" alt="Planets" type="image/gif" usemap="#Map1"> <map name="Map1"> <a href="sun.html" shape="rect" coords="0,0,82,126">太阳</a> <a href="mercur.html" shape="circle" coords="90,58,3">水星</a> <a href="venus.html" shape="circle" coords="124,58,8">金星</a> </map> </object> <p><b>注意:</b> 目前只有 Firefox 和 Opera 浏览器支持 coords 属性。</p> </body> </html>测试看看 <‹/›
IEFirefoxOperaChromeSafari
يتم دعم خاصية coords حاليًا فقط من قبل متصفحات Firefox و Opera.
لا يدعم HTML5 خاصية coords لـ <a>.
عادةً ما تستخدم خاصية coords مع shape استخدام الخاصيات معًا، يمكن من خلال هاتين الخاصيتين تحديد حجم، الشكل والوضع للعناصر <object> أو <img> المربوطة.
إحداثيات الزاوية العلوية اليسرى هي 0,0.
نصيحة:لإنشاء خريطة صورة يمكن استخدامها في جميع المتصفحات، يرجى استخدام <area> العنصر.
<a coords="value">
القيمة | الوصف |
---|---|
x1,y1,x2,y2 | إذا تم تعيين خاصية shape إلى "rect"، فإن هذا القيمة تحدد إحداثيات الزاوية العلوية اليسرى والسفلية اليمنى للمستطيل. |
x,y,radius | إذا تم تعيين خاصية shape إلى "circ"، فإن هذا القيمة تحدد إحداثيات مركز الدائرة وعرضها. |
x1,y1,x2,y2,...,xn,yn | إذا تم تعيين خاصية shape إلى "poly"، فإن هذا القيمة تحدد إحداثيات جوانب المضلع. إذا كانت الإحداثيات الأولى والأخيرة غير متطابقة، فإنه من أجل إغلاق المضلع، يجب على المتصفح إضافة زوج الإحداثيات الأخيرة. |