android webview 加载视频高度拉伸无效处理

有时有晌

于 2021-02-01 15:34:31 发布

阅读量485

点赞数

分类专栏： Android 文章标签： android webview视频显示高度不全网页视频高度调整 webview视频高度自适应

本文为博主原创文章，未经博主允许不得转载，如需强制转载，请注明出处且需对文章进行评论声明转载。

本文链接：https://blog.youkuaiyun.com/u014449096/article/details/113519589

版权

Android 专栏收录该内容

80 篇文章

订阅专栏

本文介绍了一种通过CSS实现网页中视频元素自适应不同设备屏幕大小的方法，包括大屏模式和手机模式。通过设置特定的CSS样式，可以确保视频内容在不同分辨率下保持良好的视觉效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

额这个闪现那一下不是别的，是我在浏览器中调试的大屏模式和手机模式，看下效果：

在这里插入图片描述

css样式

.video {
        position: relative;
        padding-bottom: 56.25%;
        height: 0;
        overflow: hidden;
    }
    .video iframe,
    .video object,
    .video embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

实际代码,这样高度就能自适应了，

<body>
	<p class="video">
	    <iframe height="499" width="333"  src='https://v.qq.com/txp/iframe/player.html?vid=d3212a8340x' frameborder=0 allowfullscreen=""></iframe>
	</p>
</body>