Thuộc tính media của HTML <area>

Định nghĩa và cách sử dụng

media Thuộc tính quy định tài liệu được liên kết tối ưu hóa cho loại phương tiện hoặc thiết bị nào.

Thuộc tính này được sử dụng để quy định URL mục tiêu được thiết kế cho thiết bị đặc biệt (như iPhone), giọng nói hoặc phương tiện in.

Thuộc tính này có thể chấp nhận nhiều giá trị.

Chỉ khi có Thuộc tính href thời điểm sử dụng.

Lưu ý:Thuộc tính này纯粹 là khuyến nghị.

Mô hình

Sử dụng thuộc tính media để chỉ định phương tiện / thiết bị mục tiêu URL được tối ưu hóa:

<map name="planetmap"
  <area shape="rect" coords="0,0,114,576" alt="Sun"
  href="sun.html" media="screen and (min-color-index:256)"
</map>

Thử ngay

Cú pháp

<area media="giá trị>

Toán tử có thể

Toán tử Mô tả
and Định nghĩa toán tử AND.
not Định nghĩa toán tử NOT.
, Định nghĩa toán tử OR.

Thiết bị

Giá trị Mô tả
all Mặc định. Phù hợp với tất cả các thiết bị.
aural Máy tổng hợp giọng nói.
braille Thiết bị phản hồi braille.
handheld Thiết bị cầm tay (màn hình nhỏ, băng thông hạn chế).
projection Máy chiếu.
print Chế độ xem trước in/trang in.
screen Màn hình máy tính.
tty Máy đánh máy điện và các phương tiện tương tự sử dụng lưới ký tự đồng kích thước.
tv Thiết bị loại truyền hình (độ phân giải thấp, khả năng phân trang hạn chế).

Giá trị

Giá trị Mô tả
width

Định nghĩa chiều rộng của khu vực hiển thị mục tiêu.

Có thể sử dụng tiền tố "min-" và "max-".

Ví dụ: media="screen and (min-width:500px"

height

Định nghĩa chiều cao của khu vực hiển thị mục tiêu.

Có thể sử dụng tiền tố "min-" và "max-".

Ví dụ: media="screen and (max-height:700px"

device-width

Định nghĩa chiều rộng của màn hình mục tiêu/giấy.

Có thể sử dụng tiền tố "min-" và "max-".

Ví dụ: media="screen and (device-width:500px"

device-height

Định nghĩa chiều cao của màn hình mục tiêu/giấy.

Có thể sử dụng tiền tố "min-" và "max-".

Ví dụ: media="screen and (device-height:500px"

orientation

Định nghĩa hướng của màn hình mục tiêu/giấy.

Giá trị có thể: "portrait" hoặc "landscape"

Ví dụ: media="all and (orientation: landscape"

aspect-ratio

Định nghĩa tỷ lệ chiều rộng/chiều cao của khu vực hiển thị mục tiêu.

Có thể sử dụng tiền tố "min-" và "max-".

Ví dụ: media="screen and (aspect-ratio:16/9"

device-aspect-ratio

Định nghĩa tỷ lệ device-width/device-height của màn hình mục tiêu/ giấy.

Có thể sử dụng tiền tố "min-" và "max-".

Ví dụ: media="screen and (aspect-ratio:16/9"

color

Định nghĩa số bit của mỗi màu trên màn hình mục tiêu.

Có thể sử dụng tiền tố "min-" và "max-".

Ví dụ: media="screen and (color:3"

color-index

Định nghĩa số lượng màu mà màn hình mục tiêu có thể xử lý.

Có thể sử dụng tiền tố "min-" và "max-".

Ví dụ: media="screen and (min-color-index:256"

monochrome

Định nghĩa mỗi bit của pixel trong khung hình đơn sắc.

Có thể sử dụng tiền tố "min-" và "max-".

Ví dụ: media="screen and (monochrome:2)"

resolution

Định nghĩa mật độ pixel của màn hình/ giấy mục tiêu (dpi hoặc dpcm).

Có thể sử dụng tiền tố "min-" và "max-".

Ví dụ: media="print and (resolution:300dpi)"

scan

Định nghĩa phương pháp quét của màn hình TV.

Giá trị có thể là: "progressive" và "interlace".

Ví dụ: media="tv and (scan:interlace)"

grid

Định nghĩa thiết bị đầu ra là lưới hay bitmap.

Giá trị có thể: "1" đại diện cho lưới, "0" là các giá trị khác.

Ví dụ: media="handheld and (grid:1)"

Hỗ trợ trình duyệt

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Hỗ trợ Hỗ trợ Hỗ trợ Hỗ trợ Hỗ trợ