1. 程式人生 > >html5的視訊音訊放置方法

html5的視訊音訊放置方法

在自己的站點放置視訊方法:
1:直接將視訊放在伺服器下面
2:將視訊檔案放在視訊平臺上,土豆 優酷 ,新增超連結。很多東西傳不進去,保留原本
3:html5支援的格式
Ogg
MP4
webm
視訊圖片都是二進位制格式儲存
Html5從IE9開始支援
程式碼

<!-- html5新增視訊 -->
        <div class="row">
            <div class="col-md-12">
                <video src="media/wmzl.mp4"
controls="controls" width="400px" height="600px" poster="images/login-bg.jpg">
對不起,你的瀏覽器不支援本技術,請升級你的瀏覽器 </video> </div> </div> <div class="col-md-12"> <video controls="controls" width="600px" height="400px" autoplay="autoplay"
loop="loop" poster="images/login-bg.jpg">
<source src="media/wmzl.mp4"> 對不起,你的瀏覽器不支援本技術,請升級你的瀏覽器 </video> </div>

新增音訊同上

<audio src="/i/song.ogg" controls="controls" autoplay="autoplay" loop="loop" preload="preload">
Your browser does not support the audio element.
</audio
>
<audio controls="controls"> <source src="/i/song.ogg" type="audio/ogg"> <source src="/i/song.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio>

手機和pc的佈局和展示方式都要做很大的改動

最保險的方式 通過js 獲得螢幕的解析度(高和寬) 然後去計算元件高和寬

App開發的三種形式:
1.Ios
2.Andriod
3.Html5+css+j+ php(java) +mysql+類似bootstrap
最後打包做一個app入口