3

我需要实现一个视频,它会填满容器。要求使用纯 CSS,而不是使用 Javascript。

我浏览了互联网,得出的结论是有两种纯 CSS 方法可以解决这个问题,但它们仍然存在缺陷。

  1. min-heighttransform:使用这是迄今为止最糟糕的解决方案,因为视频将扩展到其原始宽度和高度。如果容器比视频小得多,那么显示就有点奇怪了。

  2. object-fit:这似乎是迄今为止最好的解决方案,但是...... IE 不支持(仍然是这个经典问题)。

仅使用 CSS 是否有有效且跨浏览器的方法(甚至解决方法、黑客等)。任何帮助表示赞赏!

这是我的代码笔来总结我的问题。

https://codepen.io/thaido-solislab/pen/GzYjqG

4

0 回答 0