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
Vibe Coding là gì?
Lựa chọn công cụ Vibe Coding phù hợp
Prompt tạo ảnh móc khóa đủ thể loại với AI
Tạo prompt: Kỹ năng Vibe Coding cốt lõi
Hướng dẫn tạo giọng nói AI trên OmniVoice
Xây dựng ứng dụng đầu tiên bằng Vibe Coding
Cách tạo Personal Agent trong n8n
Hướng dẫn tạo storyboard trên Google Flow
Hướng dẫn tạo video hoạt hình 3D Disney trên Flow
Mẹo viết prompt AI đơn giản mà vẫn nhận phản hồi ưng ý
Karaoke Cứ giả vờ -Khánh Đơn
Cách kết nối Supabase với n8n - tự động hóa database workflow
Hướng dẫn tạo game xé túi mù trên ChatGPT
Hướng dẫn tạo giọng đọc AI của chính mình
Prompt học tiếng Trung trên Gemini như gia sư tại nhà
Làm thế nào để chạy AI coding agent một cách an toàn?
Chào ngày mới thứ 6, lời chúc thứ 6 vui vẻ
7 công cụ AI hỗ trợ lập mô hình tài chính cực tiện lợi
Hãy ngừng làm những việc mà máy móc có thể thực hiện thay bạn!