video — добавление видео

  • 25 января 2023

Справочник

Саша Ермайкина

🚀 Сегодня вам бесплатно доступен тренажёр по HTML и CSS.

Тег <video> используется для вставки видео на веб-страницу. Он позволяет пользователю воспроизводить, ставить на паузу и управлять воспроизведением видео.

<video src="video.mp4" width="640" height="360" controls>.
  Ваш браузер не поддерживает тег <code>video</code>.
</video>

Атрибут src указывает URL видеофайла, а атрибуты width и height задают размеры видеоплеера. Атрибут controls отображает элементы управления видеоплеером.

Атрибуты тега <video>:

  • src — путь к видеофайлу.
  • controls — отображает элементы управления видеопроигрывателем.
  • width — ширина видео.
  • height — высота видео.
  • poster — устанавливает изображение-обложку для видео.
  • autoplay — включает автовоспроизведение видео.
  • loop — зацикливает воспроизведение видео.
  • muted — выключает звук в видео.

Примеры использования

Базовый пример:

<video src="video.mp4" width="640" height="360" controls>
  Ваш браузер не поддерживает тег <code>video</code>.
</video>

Автовоспроизведение:

<video src="video.mp4" width="640" height="360" autoplay muted>
  Ваш браузер не поддерживает тег <code>video</code>.
</video>

Чем заменить тег

Используйте сторонний видеоплеер, например YouTube или Vimeo, для вставки видео на ваш сайт.

Полезные статьи — по почте

Подпишитесь на редакторскую рассылку о фронтенде, новых CSS-штучках и всём, что пригодится разработчику.

Присылаем одно письмо в неделю. Без спама и нейросетей.

«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.

ТелеграмПодкастБесплатные учебники