Latest web development tutorials
×

HTML курс

HTML курс HTML Краткое введение HTML редактор HTML Фонд HTML элемент HTML свойство HTML заголовок HTML пункт HTML Форматирование текста HTML ссылка HTML руководитель HTML CSS HTML изображение HTML таблица HTML список HTML блок HTML раскладка HTML форма HTML рамка HTML цвет HTML название цвета HTML значения цвета HTML скрипт HTML символьные объекты HTML URL HTML Быстрый список HTML резюме XHTML Введение

HTML5

HTML5 курс HTML5 Поддержка браузеров HTML5 Новый элемент HTML5 Canvas HTML5 Инлайн SVG HTML5 MathML HTML5 Перетаскивание HTML5 Географическое положение HTML5 видео(Video) HTML5 аудиочастота(Audio) HTML5 Input тип HTML5 элементы формы HTML5 Свойства формы HTML5 Смысловые элементы HTML5 Web память HTML5 Web SQL HTML5 кэш приложений HTML5 Web Workers HTML5 SSE HTML5 WebSocket HTML5 викторина HTML(5)Спецификация Код

HTML средства массовой информации

HTML средства массовой информации(Media) HTML Виджет HTML аудиочастота(Audio) HTML видеоплеер(Videos) HTML примеров

HTML справочное руководство

HTML список Теги(в алфавитном порядке) HTML список Теги(функция сортировки) HTML свойство HTML событие HTML холст HTML аудиочастота/видео HTML эффективный DOCTYPES HTML название цвета HTML Выбор цвета HTML Набор символов HTML ASCII HTML ISO-8859-1 HTML символ HTML URL кодирование HTML таблица условных сигналов HTTP новости HTTP способ Сочетания клавиш

HTML Video (Видео) Играть

Есть много способов для воспроизведения видео в методе HTML.


HTML Video (Видео) Играть

примеров

<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
<source src="movie.webm" type="video/webm">
<object data="movie.mp4" width="320" height="240">
<embed src="movie.swf" width="320" height="240">
</object>
</video>

Попробуйте »


Проблемы и решения

Просмотр видео в HTML не так просто!

Вам нужно много знакомых советов, чтобы убедиться, что ваш файл видео во всех браузерах (Internet Explorer, Chrome, Firefox, Safari, Opera), и все оборудование (PC, Mac, Ipad, iPhone) могут быть воспроизведены.

В этой главе вы W3CSchool суммировать проблемы и решения.


Использование тега <встраивать>

тег Роль <код вставки> является внедрение мультимедийных элементов в HTML-страницах.

Следующий HTML-код для отображения Flash-видео, встроенные в страницы:

примеров

<embed src="intro.swf" height="200" width="200">

Попробуйте »

проблема

  • HTML4 не распознает тег <встраивать>. Ваша страница не может быть проверена.
  • Если ваш браузер не поддерживает Flash, поэтому видео не будет играть
  • IPad и iPhone не может отображать Flash-видео.
  • Если конвертировать видео в другие форматы, он по-прежнему не играет во всех браузерах.

Использование тега <объект>

Роль <объект> тег для встраивания мультимедийных элементов в HTML-страницах.

Следующий фрагмент кода HTML показывает некоторые флэш-видео, встроенные в страницы:

примеров

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

Попробуйте »

Проблема:

  • Если ваш браузер не поддерживает Flash, видео не будет играть.
  • IPad и iPhone не может отображать Flash-видео.
  • Если конвертировать видео в другие форматы, он по-прежнему не играет во всех браузерах.

Используя элемент HTML5 <видео>

HTML5 <видео> тег определяет видео или кино.

<Видео> элемент во всех современных браузерах поддерживаются.

Следующий фрагмент HTML будет отображать веб-страницы встроенный Ogg, MP4, или формат WebM видео:

примеров

<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
<source src="movie.webm" type="video/webm">
您的浏览器不支持 video 标签。
</video>

Попробуйте »

Проблема:

  • Вам необходимо конвертировать видео в различные форматы.
  • <Видео> элемент не является действительным в старых браузерах.

Лучший HTML Решение

В следующем примере используется четыре различных форматов видео. HTML 5 <видео> элемент пытается играть в MP4, OGG, или форматы WebM является для воспроизведения видео. Если все удастся, то вернуться к элементу <встраивать>.

HTML 5 + <объект> + <код вставки>

<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
<source src="movie.webm" type="video/webm">
<object data="movie.mp4" width="320" height="240">
<embed src="movie.swf" width="320" height="240">
</object>
</video>

Попробуйте »

Проблема:

  • Вы должны конвертировать множество различных форматов видео

Youku Решения

Самый простой способ для отображения видео в HTML является использование Youku и другие видео-сайты.

Если вы хотите играть в видео на веб-странице, вы можете загрузить видео на Youku и других видео-сайтов, а затем вставьте HTML-код для воспроизведения видео на странице:

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

Использование гиперссылок

Если страница содержит гиперссылку, указывающую на медиа-файлов, большинство браузеров будет использовать "вспомогательное приложение", чтобы воспроизвести файл.

Следующий фрагмент кода показывает ссылки на AVI файл. Если пользователь нажимает на ссылку, браузер будет запускать "вспомогательные приложения", такие как Windows Media Player для воспроизведения файла AVI:

примеров

<a href="intro.swf">Play a video file</a>

Попробуйте »


На инлайн описании видео

Когда видео включена в веб-страницы, она называется рядный видео.

Если вы планируете использовать встроенный видео в веб-приложении, вы должны понимать, что многие люди находят встроенные видео раздражает.

Также обратите внимание, что пользователи могут закрыли свой вариант браузера встроенного видео.

Наш лучший совет только тогда, когда пользователь хочет видеть место рядный видео содержит их. Положительным примером является то, что, когда пользователь должен увидеть видео и нажмите на ссылку откроется страница и воспроизведения видео.


HTML теги мультимедиа

Новое: HTML5 новые теги.

标签 描述
<embed> 定义内嵌对象。HTML4 中不赞成,HTML5 中允许。
<object> 定义内嵌对象。
<param> 定义对象的参数。
<audio> New 定义了声音内容
<video> New 定义一个视频或者影片
<source> New 定义了media元素的多媒体资源(<video> 和 <audio>)
<track> New 规定media元素的字幕文件或其他包含文本的文件 (<video> 和<audio>)