Мультимедиа Видео Для воспроизведения видео в HTML5 используется элемент video. Чтобы настроить данный элемент, мы можем использовать следующие его атрибуты: src: источник видео, это может быть какой-либо видеофайл width: ширина элемента height: высота элемента controls: добавляет элементы управления воспроизведением autoplay: устанавливает автовоспроизведение loop: задает повторение видео muted: отключает звук по умолчанию Хотя мы можем установить ширину и высоту, но они не окажут никакого влияния на аспектное отношения ширины и высоты самого видео. Например, если видео имеет формат 375×240, то, к примеру, при настройках width="375" height="280" видео будет центрироваться на 280-пиксельном пространстве в HTML. Что позволяет избавить видео от искажений, которые были бы при растягивании. Видео в HTML5 Применим атрибуты autoplay и loop: Теперь видео будет автоматически проигрываться бесконечное число раз. Если при воспроизведении надо отключить звук, то мы можем воспользоваться атрибутом muted: Атрибут preload Еще один атрибут - preload призван управлять загрузкой видео. Он принимает следующие значения: auto: видео и связанные с ним метаданные будут загружаться до того, как видео начнет воспроизводиться. none: видео не будет загружаться в фоне, пока пользователь не нажмет на кнопку начала проигрывания metadata: в фоне до воспроизведения будут загружаться только метаданные (данные о формате, длительности и т.д), само видео не загружается Атрибут poster Атрибут poster позволяет установить изображение, которое будет отображаться до запуска видео. Этому атрибуту в качестве значения передается путь к изображению: Поддержка форматов видео Главной проблемой при использовании элемента video является поддержка различными веб-браузерами определенных форматов. С помощью вложенных элементов source можно задать несколько источников видео, один из которых будет использоваться: Элемент source использует два атрибута для установки источника видео: src: путь к видеофайлу type: тип видео (MIME-тип) Если браузер не поддерживает первый тип видео, то он пытается загрузить второй видеофайл. Если же и тип второго видеофайла не поддерживается, то браузер обращается к третьему видеофайлу. Глава 1. Введение в HTML5 Глава 2. Элементы в HTML5 Глава 3. Работа с формами Глава 4. Семантическая структура страницы Глава 5. Основы CSS3. Селекторы Глава 6. Основы CSS3. Свойства Глава 7. Создание макета страницы и верстка Глава 8. Трансформации, переходы и анимации Глава 9. Адаптивный дизайн Глава 10. Мультимедиа Глава 11. Canvas Глава 12. Flexbox Глава 13. Grid Layout Глава 14. Дополнительные статьи Об учебнике