Скрыть объявление
Гость Присоединяйся к складчине. Автокаталог для грузовых авто

Адаптивное Видео С Youtube На Css

Тема в разделе "CSS", создана пользователем Kassssablanka, 26 июл 2019.

  1. Kassssablanka

    Kassssablanka Новичок Зарегистрирован

    Регистрация
    14 сен 2016
    Сообщения
    7
    Симпатии
    2
    Баллы
    1
    Пол
    Мужской
    Может кому пригодится. Сам часто использую в работе
    Это ставим туда, где нужно видео
    HTML:
    <div class="thumb-wrap">
      <iframe width="560" height="315" src="https://www.youtube.com/embed/Y421bWMelqE" frameborder="0" allowfullscreen></iframe>
    </div>
    Это вписываем в стили или в head страницы

    Код:
    <style>
    .thumb-wrap {
      position: relative;
      padding-bottom: 56.25%; /* задаёт высоту контейнера для 16:9 (если 4:3 — поставьте 75%) */
      padding-top: 30px;
      height: 0;
      overflow: hidden;
    }
    .thumb-wrap iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }
    </style>
    Пользуемся
     
    korym нравится это.

Поделиться этой страницей

Share
Загрузка...
Плагины для XenForo/