HTML 5 中的影音標記

影片標記 - video

範例一:最簡單的影片播放

<html>
<body>
<video src="http://www.w3schools.com/html5/movie.ogg" controls="controls">
</video>
</body>
</html>

觀看範例網頁:http://dl.dropbox.com/u/6387819/html5/AV/Video1.htm

範例二:控制大小的影片播放

<html>
<body>
<video src="http://www.w3schools.com/html5/movie.ogg"  width="320" height="240" controls="controls">
</video>
</body>
</html>

觀看範例網頁:http://dl.dropbox.com/u/6387819/html5/AV/Video2.htm

範例三:多種格式的影片播放

<html>
<body>
<video width="320" height="240" controls="controls">
  <source src="http://www.w3schools.com/html5/movie.ogg" type="video/ogg" />
  <source src="http://www.w3schools.com/html5/movie.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
</body>
</html>

觀看範例網頁:http://dl.dropbox.com/u/6387819/html5/AV/Video3.htm

聲音標記 - audio

範例:聲音播放

<html>
<body>
<audio src="http://www.w3schools.com/html5/horse.ogg" controls="controls">
Your browser does not support the audio element.
</audio>
</body>
</html>

觀看範例網頁:http://dl.dropbox.com/u/6387819/html5/AV/Audio.htm

物件標記 - Object

範例:Flash 物件播放

<html>
<body>
<object data="http://www.w3schools.com/html5/helloworld.swf" />
</body>
</html>

注意:本範例經筆者測試發現 Google Chrome 可以看到,但 Firefox 看不到。

觀看範例網頁:http://dl.dropbox.com/u/6387819/html5/AV/Object.htm