在html5中，“視頻”標簽<video>定義視頻，比方電影片段或其他視頻流。
HTML5是近十年來Web標准最巨大的騰躍。HTML5並非只是用來表明Web內容，它也將Web帶入一個老練的使用平台，在這個平台上，視頻，音頻，動畫，以及同電腦的交互都被標准化。跟着HTML5的發展，各個瀏覽器都現已或即將支撐HTML5。在大潮流的推進下，微軟也表明將把HTML5作為IE9的核心，並將全力投入HTML5。
許多平常最喜歡上網看視頻、玩游戲的朋友常常抱怨不爽，由於網上很多視頻和游戲都需求裝置Flash插件，而且速度也跟不上！HTML5的出現解決了這一難題。HTML5提供了音頻視頻的標准接口，實現了無需任何插件支撐，只需瀏覽器支撐相應的HTML5標簽。怪不得都說HTML5是Flash的終結者！Safari5、Firefox4和Chrome6等瀏覽器加入了HTML5技能，能夠免除Flash插件的裝置直接播放視頻！
html中播放視頻的標簽
1，下面是一個播映視頻的最簡單樣例
（controls特點告知瀏覽器要有根本播映控件）
<videosrc=”hangge.mp4″controls>video>
·1
2，經過width和height設置視頻窗口大小
<videosrc=”hangge.mp4″controlswidth=”400″height=”300″>video>
·1
3，預加載媒體文件
設置preload不同的特點值，能夠告知瀏覽器應該怎樣加載一個媒體文件：
（1）值為auto：讓瀏覽器主動下載整個文件
（2）值為none：讓瀏覽器不必預先下載文件
（3）值為metadata：讓瀏覽器先獲取視頻文件最初的數據塊，從而足以確定一些根本信息（比方視頻的總時長，榜首幀圖畫等）
<videosrc=”hangge.mp4″controlspreload=”none”>video>
4，主動播映
（1）運用autoplay特點能夠讓瀏覽器加載完視頻文件后立即播映。
<videosrc=”hangge.mp4″controlsautoplay>video>
（2）假如啟用主動播映，能夠將播映器設置為muted狀況。這樣主動播映時會靜音，避免用戶厭煩。用戶需求的話能夠點擊播映器揚聲器圖標重新翻開聲響。
<videosrc=”hangge.mp4″controlsautoplaymuted>video>
5，循環播映
運用loop特點讓視頻播映結束時，再從頭開端播映。
<videosrc=”hangge.mp4″controlsloop>video>
6，設置替換視頻的圖片（封面圖片）
經過poster特點能夠設置，瀏覽器在下面三種情況下會運用這個圖片：
（1）視頻榜首幀未加載完畢
（2）把preload特點設置為none
（3）沒有找到指定的視頻文件
<videosrc=”hangge.mp4″controlsposter=”hangge.png”>video>
7，瀏覽器兼容，怎么讓每一個瀏覽器都能順利播映視頻
現在大部分瀏覽器都能支撐H.264格局的視頻，但Opera瀏覽器卻一直不支撐。咱們需求經過后備辦法確保每個人都能看到視頻，通常有下面幾種計划：
（1）運用多種視頻格局
和元素有個內置的格局后備體系。咱們不運用src特點，而是在其內部嵌套一組元素，瀏覽器會選擇播映榜首個它所支撐的文件。
咱們能夠增加WebM格局的視頻提供對Opera的支撐。
<sourcesrc=”hangge.mp4″type=”video/mp4″>
<sourcesrc=”hangge.webm”type=”video/webm”>
（2）增加Flash后備辦法（引薦）
上面那個方法不引薦，應為Opera瀏覽器只占不到1%的份額。特意為它把視頻都轉碼一邊太費事。運用Flash作為備用播映計划還是很便利的，同時Flash還能兼容IE8這種連元素都不支撐的老瀏覽器。
這兒運用FlowplayerFlash作為備用播映器（本地下載：flowplayer-3.2.18.zip）
“hangge.mp4″type=”video/mp4”>
“hangge.webm”type=”video/webm”>
<objectid=”flowplayer”width=”400″height=”300″
data=”flowplayer-3.2.18.swf”
type=”application/x-shockwave-flash”>
“movie”value=”flowplayer-3.2.18.swf”>
“flashvars”value=’config={“clip”:”hangge.mp4″}’>
object>
（3）也有人優先運用Flash，而HTML5作為后備辦法。
這么做是因為Flash普及率比較高，而HTML5作為后備能夠擴展iPad和iPhone用戶
<objectid=”flowplayer”width=”400″height=”300″
data=”flowplayer-3.2.18.swf”
type=”application/x-shockwave-flash”>
“movie”value=”flowplayer-3.2.18.swf”>
“flashvars”value=’config={“clip”:”hangge.mp4″}’>
“hangge.mp4″type=”video/mp4”>
“hangge.webm”type=”video/webm”>
object>