有没有办法确定嵌入响应视频元素内视频边距的高度和宽度？答案

【问题标题】：Is there a way to determine height and width of the video-margins inside an embed-responsive video element?有没有办法确定嵌入响应视频元素内视频边距的高度和宽度？
【发布时间】：2020-09-05 23:24:05
【问题描述】：

我正在寻找一种从嵌入响应元素内部获取信息的方法。

嵌入响应式视频元素会自动在 x 或 y 轴上添加内部边距，以保持视频的外观。我们曾经在 16x9 天开始时将这些“信箱”称为“信箱”。我怎样才能找到这些内部边距/信箱的大小？

我已经尽职尽责，在网上找不到任何东西或堆栈溢出。

我正在处理一个大型 Angular 7 项目，没有任何代码可以粘贴，因为这个问题有点理论化。

在这里寻找真正的前端大师来帮助我。

谢谢！

【问题讨论】：

您是否尝试使用 width / innerWidth/outerWidth 检查 jquery 方法？
@MaxiGui 现在检查一下，我们确实添加了一个 jquery 包，如果我发现有什么不好的，请告诉你，这样你就可以回答问题并获得信用。
w3schools.com/jquery/html_innerwidth.asp 根据 W3 文档，此方法为您提供元素和填充宽度，我正在寻找元素本身内部的测量值。有多少实际元素（无填充/边框/边距/定位）是信箱，有多少是视频。
如果您的最终目标是保持视频比例，这篇文章可能会有所帮助：css-tricks.com/fluid-width-video
对不起@MaxiGui，我的视频比例保持完美，我需要确定元素内部信箱的大小。感谢您的帮助合作伙伴

标签： html css bootstrap-4

【解决方案1】：

我没有将视频放在一个大容器中并处理它自己的嵌入响应式信箱，而是将它放在另一个中间容器中，并在 css 中使用 calc 来确定高度并强制中间容器达到完美的纵横比。我仍然有嵌入响应效果，但没有信箱。现在，如果我添加标签或叠加层，它会保持视频的确切大小。

height: calc((100%*3) /4);

【讨论】：