Source media 屬性

HTML DOM Source 對象

定義和用法

media 屬性設置或返回 <source> 元素中的 media 屬性的值。

<source> media 屬性 規定媒體資源的類型（文件是為哪些媒體/設備優化的）。

瀏覽器可以使用 media 屬性來確定它是否可以播放文件。如果不能，它可以選擇不下載。

HTML 參考手冊：HTML <source> 標簽

實例

返回具體文件是為哪些媒體/設備優化的：

var x = document.getElementById("mySource").media;

親自試一試

語法

返回 media 屬性：

sourceObject.media

設置 media 屬性：

sourceObject.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

規定目標顯示器/紙張的設備寬度/設備高度比率。

可以使用 "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

規定電視顯示器的掃描方法。

可能的值是 "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 media 屬性。

相關頁面

HTML 參考手冊：HTML <source> media 屬性

HTML DOM Source 對象