Thông tin liên hệ
- 036.686.3943
- admin@nguoicodonvn2008.info
Thẻ <map> được sử dụng để xác định bản đồ hình ảnh. Bản đồ hình ảnh là một hình ảnh chứa các khu vực có thể nhấp được. Ví dụ về bản đồ hình ảnh, với các khu vực có thể nhấp:
<img src="workplace.jpg" alt="Workplace" usemap="#workmap" width="400" height="379">
<map name="workmap">
<area shape="rect" coords="34,44,270,350" alt="Computer" href="computer.htm">
<area shape="rect" coords="290,172,333,250" alt="Phone" href="phone.htm">
<area shape="circle" coords="337,300,44" alt="Cup of coffee" href="coffee.htm">
</map>
Thuộc tính name bắt buộc của phần tử <map> được liên kết với thuộc tính usemap của <img> và tạo mối quan hệ giữa hình ảnh và bản đồ.
Phần tử <map> chứa một số phần tử <area>, xác định các khu vực có thể nhấp vào trong bản đồ hình ảnh.
| Phần tử < map > |
Google Chrome | MS Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| Có | Có | Có | Có | Có |
| Thuộc tính | Giá trị | Mô tả |
|---|---|---|
| name | mapname | Được yêu cầu. Chỉ định tên của bản đồ hình ảnh |
Thẻ <map> cũng hỗ trợ các thuộc tính Global trong HTML.
Thẻ <map> cũng hỗ trợ các thuộc tính sự kiện trong HTML.
Ví dụ về một bản đồ hình ảnh khác, với các khu vực có thể nhấp:
<img src="planets.gif" width="145" height="126" alt="Planets"
usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
<area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
<area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>
Hầu hết các trình duyệt sẽ hiển thị phần tử <map> với các giá trị mặc định sau:
map {
display: inline;
}
Nguồn tin: Quantrimang.com
Ý kiến bạn đọc
Những tin mới hơn
Những tin cũ hơn
10 phần mềm tạo nhạc bằng AI tốt nhất năm 2026
Llama vs ChatGPT: Nền tảng AI nào tốt hơn?
AI Voice Agent là gì? Tìm hiểu cách thức hoạt động của trợ lý thoại AI
Hướng dẫn tạo câu hỏi trắc nghiệm trên Gemini
TOP trang web tạo ảnh AI tốt nhất
Hướng dẫn chi tiết cách tạo Data Table trên n8n: Tối ưu hóa hệ thống dữ liệu tự động
8 câu lệnh Gemini xóa chi tiết thừa khỏi ảnh
Cách sử dụng AI Video Remix trong Google Photos
Mistral Vibe for Code, Claude Code, Cursor hay Codex: Đâu là coding agent tốt nhất hiện nay?
5 Claude, OpenClaw và Hermes skill xứng đáng có trong bộ công cụ của bạn
Cách phát triển sự nghiệp trong kỷ nguyên AI: 10 bước giúp bạn luôn giữ lợi thế
TOP công cụ AI tạo danh sách công việc tốt nhất
So sánh 27 mô hình Claude
So sánh 27 mô hình Claude
Thêm danh sách SharePoint vào Copilot Studio
Kimi vs ChatGPT: Đâu là trợ lý AI tốt hơn?
Cách thêm watermark AI trong Photos Windows
8 trường hợp sử dụng Claude Cowork tự động hóa doanh nghiệp giúp tiết kiệm nhiều giờ mỗi tuần
Prompt tạo phiếu luyện viết đoạn văn cho học sinh Tiểu học
TOP công cụ nhân hóa văn bản AI tự nhiên nhất