English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

HTML 参考手册

HTML 标签大全

HTML: <a> coords 属性

HTML <a> العنوان

在线示例

在<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"، فإن هذا القيمة تحدد إحداثيات جوانب المضلع. إذا كانت الإحداثيات الأولى والأخيرة غير متطابقة، فإنه من أجل إغلاق المضلع، يجب على المتصفح إضافة زوج الإحداثيات الأخيرة.

HTML <a> العنوان