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
Hướng dẫn tạo video avatar thuyết trình trên Google Vids
Bổ sung kiến thức cho agent trong Copilot Studio
9 câu lệnh phân tích hình ảnh cực chuyên nghiệp
TOP công cụ AI cho Microsoft Excel giúp phân tích dữ liệu, tạo công thức và biểu đồ
TOP công cụ AI quản lý mạng xã hội tốt nhất
Hướng dẫn tạo ảnh thumbnail trên ChatGPT
Tóm tắt các nguồn kiến thức cho agent trong Copilot Studio
TOP công cụ AI tuyển dụng tốt nhất
5 cách sáng tạo để sử dụng LLM
5 câu lệnh nâng cấp ảnh trên Gemini bạn cần nhớ
9 câu lệnh phân tích hình ảnh cực chuyên nghiệp
5 lý do Claude Cowork được đánh giá là đổi mới AI lớn nhất trong năm 2026
Tăng cường bảo mật ChatGPT bằng Lockdown Mode
Prompt tạo poster sinh nhật em bé phong cách sang trọng bằng AI
Top 10 nền tảng “no-code” AI Agent tốt nhất dành cho người mới bắt đầu
Plugin trong Claude Code là gì?
Hướng dẫn tạo phiếu bài tập viết số học từ vựng
Cách tiếp tục sử dụng mô hình AI đã ngừng hỗ trợ trong Microsoft Copilot Studio
Chọn một mô hình bên ngoài làm mô hình AI chính trong Copilot Studio
Prompt tạo bộ ảnh selfie phong cách Instagram bằng AI