引导响应嵌入不按预期工作
引导响应嵌入不按预期工作
提问于 2014-08-05 15:29:31
在引导3.1的网格系统中嵌入视频，视频不会扩展网格列的全部宽度。如何使它100%宽到父列保持高宽比？此外，即使我使用4:3视频，它在非常短的高度的浏览器中看起来非常宽。这是我的代码：
<div class="row">
<div class="col-md-8">
.
<!-- other items-->
.
</div>
<div class="col-md-4">
<div class="embed-responsive embed-responsive-4by3">
<iframe class="embed-responsive-item" src="//www.youtube.com/embed/gYhi3pAiQY4"></iframe>
</div>
</div>
</div>回答 2
Stack Overflow用户
回答已采纳
发布于 2014-10-12 12:38:17
非常确定的是，嵌入响应直到3.2才被添加。试着更新一下。
Stack Overflow用户
发布于 2016-03-17 17:50:37
如果您由于某种原因无法更新，您可以自己添加样式。相当直截了当。这是那个SASS：
// Embeds responsive
//
// Credit: Nicolas Gallagher and SUIT CSS.
.embed-responsive {
position: relative;
display: block;
height: 0;
padding: 0;
overflow: hidden;
.embed-responsive-item,
iframe,
embed,
object,
video {
position: absolute;
top: 0;
left: 0;
bottom: 0;
height: 100%;
width: 100%;
border: 0;
}
}
// Modifier class for 16:9 aspect ratio
.embed-responsive-16by9 {
padding-bottom: 56.25%;
}
// Modifier class for 4:3 aspect ratio
.embed-responsive-4by3 {
padding-bottom: 75%;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/25142692
复制相关文章
相似问题
腾讯云开发者
