第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

慕少3449830 · 更新于 2020-07-09

HTML 多媒體

本章介紹 HTML 中的多媒體。多媒體是計(jì)算機(jī)中用于人機(jī)進(jìn)行實(shí)時(shí)交互的媒介和互動(dòng)方式，其中包括圖片、文字、音頻、視頻、動(dòng)畫等。之前的章節(jié)已經(jīng)介紹了圖片和文本元素，本章主要介紹音頻和視頻相關(guān)的元素

1. object

object 元素用于定義一個(gè)網(wǎng)頁(yè)插件，使用該元素可以在網(wǎng)頁(yè)中嵌入多媒體，支持的插件類型有圖形、音頻、視頻、java applets、ActiveX、PDF、flash。不過在 HTML5 標(biāo)準(zhǔn)之前，主流瀏覽器中只有 IE3.0 之后的版本支持

實(shí)例演示
預(yù)覽 復(fù)制
復(fù)制成功！
<object classid="clsid:F08DF954-8592-11D1-B16A-00C0F0283628" id="Slider1" 
width="100" height="50">
  <param name="BorderStyle" value="1" />
  <param name="MousePointer" value="0" />
  <param name="Enabled" value="1" />
  <param name="Min" value="0" />
  <param name="Max" value="10" />
</object>
運(yùn)行案例 點(diǎn)擊 "運(yùn)行案例" 可查看在線運(yùn)行效果

雖然 object 標(biāo)簽的出現(xiàn)是用于取代 HTML 中的多媒體相關(guān)的標(biāo)簽，但是由于目前只有 IE 瀏覽器兼容性較好，所以未能實(shí)現(xiàn)初衷。雖然在手冊(cè)或者文獻(xiàn)中未能找到其他瀏覽器不兼容的原因，但是作者猜想是因?yàn)橐环矫?object 的屬性太多導(dǎo)致入門門檻較高，一方面互聯(lián)網(wǎng)朝向細(xì)分化方向發(fā)展而技術(shù)也在細(xì)分化，所以這種大一統(tǒng)的技術(shù)解決方案不太受主流大廠的接受，進(jìn)而導(dǎo)致各大瀏覽器廠商認(rèn)可度不高（具體原因以官方手冊(cè)為準(zhǔn)）。雖然兼容性不好，但是在 IE 低版本中 object 使用頻率不低，主要用于 flash

1.1 archive 屬性

定義對(duì)象相關(guān)的檔案文件的 URL 列表

1.2 classid 屬性

定義嵌入網(wǎng)頁(yè)的插件的自身的 id 值，這個(gè)值可以是 flash 的對(duì)象id或者 Java 的類的classid

實(shí)例演示
預(yù)覽 復(fù)制
復(fù)制成功！
<object classid="clock.class"></object>
運(yùn)行案例 點(diǎn)擊 "運(yùn)行案例" 可查看在線運(yùn)行效果

瀏覽器根據(jù)這個(gè) classid 可以找到插件的源代碼

1.3 codebase 屬性

這是一個(gè)可選的屬性，定義一個(gè) URL 指向 classid 屬性所引用的對(duì)象的代碼

實(shí)例演示
預(yù)覽 復(fù)制
復(fù)制成功！
<object classid="clock.class" codebase="http://www.baidu.com/classes/">
</object>
運(yùn)行案例 點(diǎn)擊 "運(yùn)行案例" 可查看在線運(yùn)行效果

codebase 相當(dāng)于 源代碼的域名，根據(jù) codebase+classID 瀏覽器可以準(zhǔn)確定位插件的源代碼。

1.4 codetype 屬性

類似于 type 屬性，用來標(biāo)識(shí) object/applet 插件的 mime 類型。

實(shí)例演示
預(yù)覽 復(fù)制
復(fù)制成功！
<object codebase="clock.class" codetype="application/java">
</object>
運(yùn)行案例 點(diǎn)擊 "運(yùn)行案例" 可查看在線運(yùn)行效果

上述代碼定義了一個(gè) Java 類型的插件。

1.5 data 屬性

用于指定用于對(duì)象處理的 URL，該屬性和 classID 類似，只不過是當(dāng) object 用于定義一個(gè) 多媒體（例如圖片）格式的時(shí)候，data 用于表示圖片的源路徑，等價(jià)于 img 標(biāo)簽的 src 屬性，不同的是 img 標(biāo)簽的 src 屬性只能用于圖像類型，data 則可用于幾乎任意的多媒體文件類型。

實(shí)例演示
預(yù)覽 復(fù)制
復(fù)制成功！
<object codebase="clock.class" codetype="application/jpeg" data=''>
</object>
運(yùn)行案例 點(diǎn)擊 "運(yùn)行案例" 可查看在線運(yùn)行效果

1.6 declare 屬性

通常用于當(dāng) object 插件是 flash 或者 applet 時(shí)，定義插件編程語(yǔ)言的前置聲明，不參與展示效果。

1.7 form 屬性

定義 object 元素對(duì)應(yīng)的表單的id，目前沒有主流瀏覽器支持 form 屬性。

1.8 standby 屬性

定義當(dāng) object 在加載的過程中，瀏覽器的 object 位置上顯示的文本，此屬性類似于 img 標(biāo)簽中的 alt 屬性。

1.9 height width 屬性

定義插件的高度和寬度。

1.10 hspace vspace 屬性

定義插件的周圍的空白。

2. embed

這個(gè)標(biāo)簽的作用基本上和 object 相似，都是用來嵌入插件，不同的是 object 只有 IE 內(nèi)核的瀏覽器支持比較完善，而非IE內(nèi)核的瀏覽器則對(duì) embed 支持度較高。embed 可以嵌入到 object 標(biāo)簽內(nèi)，當(dāng)瀏覽器不支持 object 時(shí)會(huì)自動(dòng)加載 object 內(nèi)的元素來渲染。

實(shí)例演示
預(yù)覽 復(fù)制
復(fù)制成功！
<embed src="helloworld.swf" /> <!-- 定義一個(gè)flash -->
運(yùn)行案例 點(diǎn)擊 "運(yùn)行案例" 可查看在線運(yùn)行效果

3. param

該標(biāo)簽用于為 object 插件定義運(yùn)行時(shí)參數(shù)，控制插件的運(yùn)行方式。

實(shí)例演示
預(yù)覽 復(fù)制
復(fù)制成功！
<object classid="clsid:F08DF954-8592-11D1-B16A-00C0F0283628" id="test">
  <param name="BorderStyle" value="1" />
  <param name="MousePointer" value="0" />
  <param name="Enabled" value="1" />
  <param name="Min" value="0" />
  <param name="Max" value="10" />
</object>
運(yùn)行案例 點(diǎn)擊 "運(yùn)行案例" 可查看在線運(yùn)行效果

上述定義的每個(gè) param 相當(dāng)于一個(gè)插件的控制參數(shù)，name 對(duì)應(yīng)參數(shù)的名稱，value 對(duì)應(yīng)參數(shù)的值，根據(jù)具體的插件的不同而不同。

4. audio

audio 是 HTML5 中的新標(biāo)簽，用于播放音頻流，格式如下：

實(shí)例演示
預(yù)覽 復(fù)制
復(fù)制成功！
<audio src="test.wav">
您的瀏覽器不支持 audio 標(biāo)簽。 <!-- 定義瀏覽器不支持該標(biāo)簽時(shí)所展示的內(nèi)容-->
</audio>
運(yùn)行案例 點(diǎn)擊 "運(yùn)行案例" 可查看在線運(yùn)行效果

上述代碼相當(dāng)于在瀏覽器中定義了一個(gè)播放器，展示效果如下
圖片描述

4.1 autoplay屬性

當(dāng)定義了該屬性時(shí)，音頻會(huì)立即播放。

4.2 controls屬性

該屬性用于定義是否向用戶展示播放按鈕，如果未定義這個(gè)屬性，則瀏覽器默認(rèn)不顯示任何播放器的控件（播放、音量、進(jìn)度等）。控件可以通過 audio 提供的事件，通過 div+css+JavaScript 自定義實(shí)現(xiàn)。

4.3 loop屬性

該屬性定義時(shí)，表示音頻是否會(huì)重復(fù)循環(huán)播放。

4.4 muted屬性

當(dāng)該屬性被定義是，音頻默認(rèn)播放時(shí)是以靜音方式播放。

4.5 preload屬性

該屬性定義音頻加載的方式，有3個(gè)可選值（auto 自動(dòng)加載 meta 只加載元數(shù)據(jù) none 手動(dòng)加載）。當(dāng)設(shè)置了 autoplay 時(shí)，該屬性不生效。

4.6 src屬性

定義音頻的 URL。

5. source

該標(biāo)簽用于定義音頻/視頻播放器的源文件，為了兼容不同的瀏覽器對(duì)不同的音頻類型的支持，例如：

實(shí)例演示
預(yù)覽 復(fù)制
復(fù)制成功！
<audio>
   <source src="test.ogg" type="audio/ogg"> <!-- 定義Ogg類型的音頻 -->
   <source src="test.mp3" type="audio/mpeg"> <!-- 定義MP3類型的音頻-->
</audio>
運(yùn)行案例 點(diǎn)擊 "運(yùn)行案例" 可查看在線運(yùn)行效果

上述音頻播放器，放到不支持 Ogg 文件的瀏覽器時(shí)，會(huì)自動(dòng)加載 MP3 文件。

6. video

這個(gè)標(biāo)簽用于定義視頻播放器，大部分屬性和 audio 類似，是 HTML5 中新增的標(biāo)簽。

實(shí)例演示
預(yù)覽 復(fù)制
復(fù)制成功！
<video src="/i/movie.ogg" controls="controls">
your browser does not support the video tag
</video>
運(yùn)行案例 點(diǎn)擊 "運(yùn)行案例" 可查看在線運(yùn)行效果

視覺效果如下
圖片描述

7. 兼容性

HTML中定義多媒體元素不是很復(fù)雜，但是難點(diǎn)在于各種瀏覽器的兼容性問題，例如：

  • iPhone iPad 不支持 flash
  • 低版本 IE 不支持 embed
  • 非 IE 瀏覽器不完全支持 object
  • 音視頻標(biāo)簽 audio video 僅支持 HTML5 標(biāo)準(zhǔn)
  • 多媒體文件格式在不同瀏覽器的支持程度不同
  • 多媒體文件格式在不同的硬件上的支持程序也不同
    所以說如果你需要大量使用多媒體技術(shù)，那么必須要非常熟悉多媒體技術(shù)在瀏覽器上的兼容性問題才行

8. 小結(jié)

本章介紹了多媒體技術(shù)在 HTML4 和 HTML5 中的使用方式，以及在不同的瀏覽器中的兼容性問題