最新的Web開發教程
 

HTML <source> media Attribute

<HTML <source>標籤

使用的media屬性:

<source src="movie.ogg" type="video/ogg"
media="screen and (min-width:320px)">
試一試»

定義和用法

media屬性指定媒體資源的類型(何種媒體/設備中的文件被優化)。

瀏覽器可以使用此屬性來確定它是否可以播放的文件或沒有。 如果不能,它可以選擇不下載。

注意:這個屬性可以接受多個值。


瀏覽器支持

屬性
media 不支持 不支持 不支持 不支持 不支持

HTML 4.01和HTML5之間的差異

<source>標籤是HTML5中的新。


句法

<source media="value">

可能的Operators

描述
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-"可使用的前綴。
Example: media="screen and (max-height:700px)"
類=“notranslate”新增設備的寬度 指定目標顯示器/紙張的寬度。
"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)"

<HTML <source>標籤