html5的video标签如何拉伸视频，使其变形并且适配div宽高比例？ 5
6个回答
展开全部
父集div使用relative定位，padding-bottom值充当空间，子集video元素absolute定位
具体例子如下，比如视频是16:9的比例，这样比例就不会变了，并且适配div的等高比例
css
.vid-wrapper{
width:100%;
position:relative;
padding-bottom:56.25%; /*需要用padding来维持16:9比例,也就是9除以16*/
height: 0;
}
.vid-wrapper video{
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%
}html
<div class="vid-wrappper">
<video src=""></video>
</div
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
上海钇视科技
2024-11-08 广告
上海钇视科技有限公司，联系方式：18621895830。致力于建立具有自主知识产权的数据服务产品，包括3D交互引擎编辑器we3D，数据应用平台weStack。创始团队具有知名互联网，软件企业工作背景，在数字孪生领域具有33年以上实践经验的专...
点击进入详情页
本回答由上海钇视科技提供
展开全部
在标签内增加style="width:(你要求的宽度)px; height:(你要求的高度)px;"，注意符号都是英文的
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
使用以下代码即可
<div style="width:400px;height:400px;">
<video src="/i/movie.ogg" width="100%" height="100%" controls="controls">
</video>
</div>
<div style="width:400px;height:400px;">
<video src="/i/movie.ogg" width="100%" height="100%" controls="controls">
</video>
</div>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
有宽高度设置啊
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
直接用object-fit: fill;
如果是动态创建的
元素.style.objectFit = "fill"
如果是动态创建的
元素.style.objectFit = "fill"
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（4）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
