我想使用 Bootstrap 实现类似的目标:
|--------------------|------| ^
| | Some | |
| 16/9 | Text | | 90% height
| | | |
|--------------------|------| v
<--------------------------->
width 100% (screen width)
我已经能够创建视频保持 16/9 比例的两个容器,但 Div 无法容纳剩余空间。相反,视频只是覆盖了正确的 DIV。这意味着我将添加到我的 DIV 中的文本不会居中......正如您在那里看到的那样:
你能帮帮我吗?
最佳答案
所以,我设法用 Javascript 做到了。一种简单的方法。
<script>
var zvHeight = (screen.availHeight/100)*80;
var zvWidth = (zvHeight/9)*16;
document.getElementById('zv').style.width = zvWidth+"px";
zpsWidth = screen.availWidth-zvWidth;
document.getElementById('zps').style.width = zpsWidth+"px";
</script>
关于css - 自举 |两列一列 16 :9 video and some text,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45793337/