我正在创建一个 Shopify 网站,我想在顶部显示一个英雄视频。但是视频莫名其妙的偏右了,左边一片空白。任何人都知道如何让它 100% 响应?我对编码知之甚少,但我已尽我所能……感谢任何帮助。
找了三天都没找到...
我的网站在这里:https://v3xt5u4y7es2qbjl-22601531467.shopifypreview.com
目前顶部的视频不是我想要的。其实我只想保留第二个视频。
HTML
<div id="hero_video">
<video autoplay="" playsinline="" muted="" loop="" id="Hero_Video">
<source src="https://cdn.shopify.com/s/files/1/0226/0153/1467/files/background_video_1.mp4?1009" type="video/mp4">
</video>
</div>
CSS
#Hero_Video {
position: relative;
width: 100vw;
max-height: 100%;
}
/* Hero Video Style*/
.hero_video{
left: 50%;
margin-left: -200vw;
margin-right: -50vw;
max-width: 100vw;
position: relative;
right: 50%;
width: 100vw;
}
最佳答案
将宽度 100% 添加到您的视频,它应该可以工作
#Hero_Video {
width: 100%;
}
关于html - 如何使此视频的宽度 100% 响应?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56162086/