大卡特尔移动视频视​​图

Question

我在我的网站上添加了一个视频但是当我在移动设备上观看视频时，它对于屏幕来说太大了。有什么方法可以让视频适合移动屏幕吗？或者只是让网站更适合移动？ 我的网站：http://notsomefantasy.bigcartel.com/

Answer 1

将此添加到商店的自定义CSS：

.vid-container {
  height: 0; 
  overflow: hidden;
  padding-bottom: 50%;
  padding-top: 35px;
  position: relative;
}

.vid-container iframe,
.vid-container object,
.vid-container embed {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

然后在您的主页上使用以下代码 - 确保将{{ EMBED CODE ID }}替换为YouTube为您提供的内容。

<div class="vid-container">
  <iframe width="854" height="480" src="https://www.youtube.com/embed/{{EMBED CODE ID}}" frameborder="0" allowfullscreen=""></iframe>
</div>