HTML <area> media 屬性

HTML <a> 標簽

定義和用法

media 屬性規定被鏈接文檔針對哪種媒體或設備進行了優化。

此屬性用于規定目標 URL 是為特殊設備（如 iPhone）、語音或印刷媒體設計的。

該屬性可以接受多個值。

僅在存在 href 屬性 時使用。

注意：此屬性純粹是建議性的。

實例

使用 media 屬性指定目標 URL 優化的媒體/設備：

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

親自試一試

語法

<area media="value">

可能的運算符

運算符 描述
and 規定 AND 運算符。
not 規定 NOT 運算符。
, 規定 OR 運算符。

設備

值 描述
all 默認。適合所有設備。
aural 語音合成器。
braille 盲文反饋裝置。
handheld 手持設備（小屏幕、有限的帶寬）。
projection 投影機。
print 打印預覽模式/打印頁面。
screen 計算機屏幕。
tty 電傳打字機以及使用等寬字符網格的類似媒介。
tv 電視類型設備（低分辨率、有限的分頁能力）。

值

值 描述
width

規定目標顯示區域的寬度。

可使用 "min-" 和 "max-" 前綴。

例子：media="screen and (min-width:500px)"
height

規定目標顯示區域的高度。

可使用 "min-" 和 "max-" 前綴。

例子：media="screen and (max-height:700px)"
device-width

規定目標顯示器/紙張的寬度。

可使用 "min-" 和 "max-" 前綴。

例子：media="screen and (device-width:500px)"
device-height

規定目標顯示器/紙張的高度。

可使用 "min-" 和 "max-" 前綴。

例子：media="screen and (device-height:500px)"
orientation

規定目標顯示器/紙張的方向。

可能的值："portrait" 或 "landscape"

例子：media="all and (orientation: landscape)"
aspect-ratio

規定目標顯示區域的寬度/高度比。

可使用 "min-" 和 "max-" 前綴。

例子：media="screen and (aspect-ratio:16/9)"
device-aspect-ratio

規定目標顯示器/紙張的 device-width/device-height 比率。

可使用 "min-" 和 "max-" 前綴。

例子：media="screen and (aspect-ratio:16/9)"
color

規定目標顯示器的每種顏色的位數。

可使用 "min-" 和 "max-" 前綴。

例子：media="screen and (color:3)"
color-index

規定目標顯示器能夠處理的顏色數。

可使用 "min-" 和 "max-" 前綴。

例子：media="screen and (min-color-index:256)"
monochrome

規定在單色幀緩沖中的每像素比特。

可使用 "min-" 和 "max-" 前綴。

例子：media="screen and (monochrome:2)"
resolution

規定目標顯示器/紙張的像素密度 (dpi 或 dpcm)。

可使用 "min-" 和 "max-" 前綴。

例子：media="print and (resolution:300dpi)"
scan

規定 tv 顯示器的掃描方法。

可能的值是："progressive" 和 "interlace"。

例子：media="tv and (scan:interlace)"
grid

規定輸出設備是網格還是位圖。

可能的值："1" 代表網格，"0" 是其他。

例子：media="handheld and (grid:1)"

瀏覽器支持

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 支持 支持 支持 支持

HTML <a> 標簽