HTML Video

  • ຫົວຂໍ້ເຄື່ອນກັບ HTML Audio
  • ຫົວຂໍ້ເພີ່ມໄປ HTML YouTube

Có rất nhiều cách để phát video trong HTML.

实例


亲自试一试

Vấn đề, vấn đề và cách giải quyết

Việc phát video trong HTML không dễ dàng!

Bạn cần phải nắm vững nhiều kỹ năng để đảm bảo rằng tệp video của bạn có thể phát được trên tất cả các trình duyệt (Internet Explorer, Chrome, Firefox, Safari, Opera) và tất cả các phần cứng (PC, Mac, iPad, iPhone).

Trong chương này, CodeW3C.com đã tổng hợp các vấn đề và cách giải quyết.

Sử dụng nhãn <embed>

Nhãn <embed> có tác dụng chèn các yếu tố đa phương tiện vào trang HTML.

Dưới đây là đoạn mã HTML hiển thị video Flash được chèn vào trang web:

实例

<embed src="movie.swf" height="200" width="200"/>

亲自试一试

问题

  • HTML4 không thể nhận diện nhãn <embed>. Trang web của bạn không thể được xác thực.
  • Nếu trình duyệt không hỗ trợ Flash, video sẽ không thể phát được
  • iPad và iPhone không thể hiển thị video Flash.
  • Nếu bạn chuyển đổi video thành định dạng khác, nó vẫn không thể phát được trên tất cả các trình duyệt.

Sử dụng nhãn <object>

Nhãn <object> có tác dụng chèn các yếu tố đa phương tiện vào trang HTML.

Dưới đây là đoạn mã HTML hiển thị video Flash được chèn vào trang web:

实例

<object data="movie.swf" height="200" width="200"/>

亲自试一试

问题

  • Nếu trình duyệt không hỗ trợ Flash, video sẽ không thể phát được.
  • iPad và iPhone không thể hiển thị video Flash.
  • Nếu bạn chuyển đổi video thành định dạng khác, nó vẫn không thể phát được trên tất cả các trình duyệt.

Sử dụng nhãn <video>

标签 <video> là một nhãn mới trong HTML 5.

以下 HTML 片段会显示一段嵌入网页的 ogg、mp4 或 webm 格式的视频:

实例


亲自试一试

问题

  • 您必须把视频转换为很多不同的格式。

最好的 HTML 解决方法

HTML 5 + +


亲自试一试

上例中使用了 4 中不同的视频格式。HTML 5

问题

  • 您必须把视频转换为很多不同的格式
  • 元素无法通过 HTML 4 和 XHTML 验证。

注释:使用 (HTML5) 解决验证问题。

优酷解决方案

在 HTML 中显示视频的最简单的方法是使用优酷等视频网站。

如果您希望在网页中播放视频,那么您可以把视频上传到优酷等视频网站,然后在您的网页中插入 HTML 代码即可播放视频:

<embed src="http://player.youku.com/player.php/sid/XMzI2NTc4NTMy/v.swf" 
width="480" height="400" 
type="application/x-shockwave-flash">

亲自试一试

使用超链接

如果网页包含指向媒体文件的超链接,大多数浏览器会使用“辅助应用程序”来播放文件。

以下代码片段显示指向 AVI 文件的链接。如果用户点击该链接,浏览器会启动“辅助应用程序”,比如 Windows Media Player 来播放这个 AVI 文件:

实例

Play a video file

亲自试一试

关于内联视频的一段注释

当视频被包含在网页中时,它被称为内联视频。

如果您打算在 web 应用程序中使用内联视频,您需要意识到很多人都觉得内联视频令人恼火。

ຂະນະທີ່ຜູ້ນຳໃຊ້ອາດປິດຕະຫຼາດວິດີໂອບັນລຸໃນບັນຊີບັນຍາສານ.

ຄຳແນະນຳທີ່ດີຈະເປັນການບັນທຶກພຽງແຕ່ໃນບ່ອນທີ່ຜູ້ນຳໃຊ້ຕ້ອງການເບິ່ງວິດີໂອບັນລຸ. ຕົວຢ່າງທີ່ດີຈະເປັນບ່ອນທີ່ຜູ້ນຳໃຊ້ຕ້ອງການເບິ່ງວິດີໂອແລະກົດຢູ່ຫົວຂໍ້ວັດຖຸບັນດາ, ທີ່ຜູ້ນຳໃຊ້ກົດຢູ່ຫົວຂໍ້ວັດຖຸບັນດາຈະເປັນປະກາດເວັບໄຊທີ່ວິດີໂອຈະເປັນການບັນທຶກ.

ອັດຕາສະຖານະການສະພາບ HTML 4.01

ອັດຕາ ອະທິບາຍ
<applet> ບໍ່ນັບຫາ.ກໍານົດຂອງ applet ທີ່ສົ່ງເຂົ້າ.
<embed> ບໍ່ນັບຫາ.ກໍານົດຂອງອັດຕາທີ່ສົ່ງເຂົ້າ. (HTML5 ອະນຸຍາດ)
<object> ກໍານົດຂອງອັດຕາທີ່ສົ່ງເຂົ້າ.
<param> ກໍານົດປະກອບສັນຍາຂອງໂຄດອັດຕາ.

ອັດຕາສະຖານະການສະພາບ HTML 5

ອັດຕາ ອະທິບາຍ
<video> ອັດຕາກໍານົດຂອງສຽງ, ອີງຕາມຫົວຂໍ້.
<embed> ອັດຕາກໍານົດຂອງຂອງອັດຕາ, ອີງຕາມຫົວຂໍ້ວັດຖຸ.
  • ຫົວຂໍ້ເຄື່ອນກັບ HTML Audio
  • ຫົວຂໍ້ເພີ່ມໄປ HTML YouTube