Как бы я вставил адаптивное воспроизводимое видео YouTube в это изображение? - PullRequest
Новая
       11

Как бы я вставил адаптивное воспроизводимое видео YouTube в это изображение?

0 голосов
/ 22 ноября 2018

Как бы я вставил адаптивное воспроизводимое видео YouTube в этот телевизор?(Желательно не на автозапуске).

Мне тяжело с этим, и мне было интересно, если кто-нибудь может помочь.Спасибо. 

.tv {
  position: absolute;
  left: calc(50% - 550px/2);
  top: calc(50% - 380px/2);
}

.tv img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  width: 550px;
}

.video {
  position: absolute;
  top: 25px;
  left: 20px;
}



.b {
  width: 400px;
  height: 300px;
  background: black;
}
<div class="tv">
  <img src="http://honeypotmarketing.com/wp-content/uploads/OLD-SCHOOL-TV.png" alt="" />
  <!-- broken video -->
  <div class="video">
        <video class="b" src="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4" autoplay></video>
  </div>
</div>

1 Ответ

0 голосов
/ 22 ноября 2018

Для отзывчивости вам нужно добавить css для высоты div: auto и width в%, а не в пикселях, например: 

style="max-width:100%;height:auto;"

Надеюсь, это сработает.Спасибо:)

...