資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何在 HTML 中定義影像地圖中的區域？
使用 <area> 標籤在 HTML 中定義影像地圖中的區域。
HTML <area> 標籤支援以下附加屬性：
| 屬性 | 值 | 描述 |
|---|---|---|
| Alt | 文字 | 指定區域的替代文字。 |
| coords | 如果 shape = "rect" 則 coords = "left, top, right, bottom" | 指定與 shape 屬性相對應的座標，以定義影像地圖中影像的區域。 |
下載  | 檔名 | 指定當使用者單擊超連結時下載的目標。 |
| Href | URL | 指定連結指向的頁面的 URL 或錨點的名稱。 |
hreflang  | 語言程式碼 | 指定目標 URL 的語言。 |
media  | 媒體查詢 | 指定目標 URL 針對其最佳化的媒體/裝置。 |
| Nohref | true/false | 從影像地圖中排除區域 |
rel  | 替代 作者 書籤 幫助 許可證 下一個 nofollow noreferrer prefetch 上一個 搜尋 標籤 | 指定當前文件和目標 URL 之間的關係 |
| Shape | rect 矩形 circ 圓形 | 指定影像地圖的形狀 |
| poly 多邊形 | ||
| Target | _blank _parent _self _top | 在何處開啟目標 URL。 _blank - 目標 URL 將在新視窗中開啟 _self - 目標 URL 將在其被點選的同一框架中開啟 _parent - 目標 URL 將在父框架集中開啟 _top - 目標 URL 將在視窗的整個主體中開啟 |
type  | mime_type | 指定目標 URL 的 MIME（多用途網際網路郵件擴充套件）型別。 |
示例
您可以嘗試執行以下程式碼來實現 <area> 標籤：
<!DOCTYPE html> <html> <head> <title>HTML area Tag</title> </head> <body> <img src = /images/usemap.gif alt = "usemap" border = "0" usemap = "#tutorials"/> <map name = "tutorials"> <area shape = "poly" coords = "74,0,113,29,98,72,52,72,38,27" href = "/perl/index.htm" alt = "Perl Tutorial" target = "_blank" /> <area shape = "rect" coords = "22,83,126,125" alt = "HTML Tutorial" href = "/html/index.htm" target = "_blank" /> <area shape = "circle" coords = "73,168,32" alt = "PHP Tutorial" href = "/php/index.htm" target = "_blank" /> </map> </body> </html>
更新於： 2020-03-03
433 次檢視
廣告