Дизайн адаптивных веб-страниц - Видео

Использование свойства width

Использование свойства width Если установить Если установить

Пример

video {
  width: 100%;
  height: auto;
}

Попробуйте сами

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

Использование свойства max-width

Если установить Использование свойства max-width Если установить

Пример

video {
  max-width: 100%;
  height: auto;
}

Попробуйте сами

Добавление видео на страницу примера

Мы хотим добавить видео на страницу примера. Видео будет уменьшено до тех пор, пока оно не займет все доступное пространство:

Пример

video {
  width: 100%;
  height: auto;
}

Попробуйте сами