音視頻格式轉(zhuǎn)換神器——格式工廠
如果您下載了上一篇《為HTML頁(yè)面添加音頻、視頻的方法——零基礎(chǔ)自學(xué)網(wǎng)頁(yè)制作》（目錄在結(jié)尾）中的素材，您會(huì)看到有這樣一個(gè)文件傲茄，如圖
這就是格式工廠軟件的安裝程序
建議大家在學(xué)習(xí)之前下載素材用以實(shí)踐隔心，下載地址如下：https://pan.baidu.com/s/1reRWno0ibYRcYXjw4MClqw
提取碼：td80
因?yàn)楦袷焦S是免費(fèi)軟件，所以大家直接安裝就可以了竟痰，不需要序列號(hào)签钩，安裝過(guò)程如下：
1.雙擊安裝程序
2.選擇安裝盤符
3.等待進(jìn)度條跑完就好了。大家注意坏快，安裝時(shí)一定要閱讀提示铅檩，一些沒(méi)必要的捆綁軟件記得不要安裝！
完成安裝后莽鸿，點(diǎn)擊"開始"菜單昧旨，如圖：
這樣我們就可以打開格式工廠了，打開后如圖：
通過(guò)這個(gè)菜單我們可知祥得，這個(gè)軟件不僅可以為音頻兔沃、視頻轉(zhuǎn)換格式，還可以給圖片轉(zhuǎn)換格式级及。如圖：
下面我們就來(lái)操作一下如何為視頻轉(zhuǎn)換格式乒疏。
step1.點(diǎn)擊"視頻"
點(diǎn)擊后是這樣的，點(diǎn)擊"AVI FLV MOVE"這個(gè)區(qū)域饮焦。
效果如下怕吴，出現(xiàn)了一個(gè)新的菜單。
step2.選擇要轉(zhuǎn)換的格式县踢，如圖转绷，我們先選擇ogg，點(diǎn)擊硼啤！
點(diǎn)擊"確定"
彈出這樣一個(gè)菜單：
step3.選擇文件议经，如圖，點(diǎn)擊"添加文件"
我們使用"利維坦.mp4"這個(gè)文件進(jìn)行轉(zhuǎn)換，如圖：
點(diǎn)擊"打開"后爸业，跳到這個(gè)界面其骄，如下圖，然后點(diǎn)擊確定扯旷。
這時(shí)界面就跳回最初的界面上拯爽，如下圖，點(diǎn)擊開始钧忽，如紅框中毯炮。
step4.等待轉(zhuǎn)換完成，如圖所示：
然后點(diǎn)擊"輸出文件夾"按鈕找到轉(zhuǎn)換好的文件耸黑，如圖：
這時(shí)桃煎，我們可以把這個(gè)轉(zhuǎn)換好的文件拷走。
完成之后大刊，大家可以按照上述步驟繼續(xù)轉(zhuǎn)換出swf为迈、flv格式的視頻文件。
轉(zhuǎn)換音頻和視頻的步驟類似缺菌，大家可以在音頻欄中進(jìn)行選擇相應(yīng)格式并操作葫辐。
格式工廠除了音視頻格式轉(zhuǎn)換外，也具有簡(jiǎn)單的圖片處理伴郁，視頻拼接耿战，錄屏等功能，感興趣的小伙伴可以自行測(cè)試焊傅。
HTML中兼容不同瀏覽器的音視頻元素寫法
學(xué)過(guò)上一篇《》的小伙伴都會(huì)知道剂陡，目前音頻也好、視頻也好有非常多的格式存在狐胎，不同瀏覽器能支持的格式也不盡相同鸭栖，就拿swf文件看，2019年以后版本的火狐瀏覽器就不再支持了（還可以通過(guò)一些特殊手段播放握巢，這里指的是常規(guī)的html標(biāo)簽用法）纤泵。而chrome（google瀏覽器）在使用<embed>標(biāo)簽導(dǎo)入swf文件后就可以播放，示例代碼如下：
<!DOCTYPE HTML> <html> <head> <title>音視頻導(dǎo)入</title> <meta charset="utf-8"> </head> <body> <embed src="video/利維坦.swf" width="320" height="240" /> </body> </html>
在chrome中可以打開镜粤。不過(guò)要用戶允許使用flashplayer才行，如圖：
這時(shí)我們發(fā)現(xiàn)玻褪，在默認(rèn)情況下肉渴，播放器控制面板并沒(méi)有出現(xiàn)。
使用ie瀏覽器卻不能打開带射，因?yàn)獒槍?duì)swf文件同规，ie瀏覽器需要使用<object>標(biāo)簽。示例代碼如下：
<embed src="video/利維坦.swf" width="320" height="240" /><object data="video/利維坦.mp4" width="320" height="240"></object>
如圖所示：沒(méi)有正常顯示的是<embed>標(biāo)簽，打開的是<object>標(biāo)簽券勺，并且有控制器绪钥。如圖：
實(shí)際上swf是個(gè)歷史遺留問(wèn)題，<object>主要是針對(duì)ie瀏覽器來(lái)播放swf或其他需要flashplayer支持的視頻格式关炼。<embed>的標(biāo)簽則用來(lái)解決非ie瀏覽器中播放swf或其他需要flashplayer支持的視頻格式程腹。
而蘋果瀏覽器壓根就不支持swf這一類的文件。
目前網(wǎng)絡(luò)視頻格式基本上都統(tǒng)一為MP4格式了儒拂，在html5標(biāo)準(zhǔn)中寸潦，<video>標(biāo)簽頁(yè)取代了<object>和<embed>標(biāo)簽來(lái)播放視頻，同時(shí)支持多種格式選擇的代碼模式社痛，示例代碼如下：
它的結(jié)構(gòu)是<video></video>標(biāo)簽中套入了多個(gè)<source/>標(biāo)簽來(lái)指定不同格式的文件见转，同時(shí)并列套入一個(gè)<object></object>標(biāo)簽，在<object></object>標(biāo)簽中再套入一個(gè)<embed>標(biāo)簽蒜哀。這樣的寫法的目的是為了讓使用各種各樣的瀏覽器的用戶都可以打開視頻斩箫。這種寫法目前是html認(rèn)為的最好的寫法。
大家可以試一試撵儿，使用之前轉(zhuǎn)好的不同格式的視頻乘客。
大家回想一下，導(dǎo)入不同格式音頻的寫法也是這個(gè)樣子统倒，示例代碼如下：
<audio controls="controls"> <source src="song.ogg" type="audio/ogg" /> <source src="song.mp3" type="audio/mpeg" /> Your browser does not support the audio element.<!--你的瀏覽器不支持這個(gè)音頻元素--></audio>
其他的兼容方法
在w3school的說(shuō)明中給出了一種包打一切的方法寨典，說(shuō)起來(lái)有點(diǎn)搞笑。
視頻的話房匆，w3school建議可以上傳優(yōu)酷耸成，然后使用這樣的代碼嵌入自己的頁(yè)面中，官方示例代碼如下：
<embed src="http://player.youku.com/player.php/sid/XMzI2NTc4NTMy/v.swf" width="480" height="400" type="application/x-shockwave-flash"></embed>
當(dāng)然也可以使用我們之前在《》這篇教程中講到的優(yōu)酷官方推薦的<iframe>標(biāo)簽的寫法浴鸿。
音頻的話井氢，可以調(diào)用免費(fèi)的在線雅虎播放器來(lái)播放，官方示例代碼如下：
首先使用一個(gè)<a>標(biāo)簽岳链，使用href屬性指定音頻文件的路徑花竞。然后使用<script></script>標(biāo)簽來(lái)啟東雅虎播放器的JavaScript程序來(lái)播放。這個(gè)<script>標(biāo)簽以后在學(xué)習(xí)JavaScript時(shí)掸哑，我們會(huì)經(jīng)常和它打交道约急，它的主要作用就是導(dǎo)入腳本。
出于好奇我試了試苗分，代碼如下：
</video><a href="audio/千年的祈禱.mp3">Play Sound</a><script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script></body>
大家注意厌蔽，<script>標(biāo)簽寫在</body>上面即可，也就是在頁(yè)面內(nèi)容的最下面摔癣，不必非要和<a>標(biāo)簽湊在一起奴饮。放在<head></head>中也可以纬向！
頁(yè)面效果如下：
點(diǎn)擊"Play Sound"之后跳到這樣的界面：
最后給大家介紹一個(gè)導(dǎo)入字幕的方法，示例代碼如下：
<video width="320" height="240" controls="controls"> <source src="forrest_gump.mp4" type="video/mp4" /> <source src="forrest_gump.ogg" type="video/ogg" /> <track kind="subtitles" src="subs_chi.srt" srclang="zh" label="Chinese"> <track kind="subtitles" src="subs_eng.srt" srclang="en" label="English"></video>
其中的<track>標(biāo)簽就是導(dǎo)入字幕的標(biāo)簽戴卜，是一個(gè)html5中出現(xiàn)的新標(biāo)簽逾条。屬性解釋如下：
因?yàn)闆](méi)有配套的srt文件，因此這里就不演示了投剥，大家了解一下师脂，以后有機(jī)會(huì)再細(xì)致測(cè)試一下。
