其他网站的视频应该也适用,前提是适用了bootstrap的框架。
具有响应式内容的嵌入

根据被嵌入内容的外部容器的宽度,自动创建一个固定的比例,从而让浏览器自动确定视频或 slideshow 的尺寸,能够在各种设备上缩放。

这些规则被直接应用在 <iframe><embed><video><object> 元素上。如果你希望让最终样式与其他属性相匹配,还可以明确地使用一个派生出来的 .embed-responsive-item 类。


超级提示: 不需要为 <iframe> 元素设置 frameborder="0" 属性,因为我们已经替你这样做了!
<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="..."></iframe></div>

<!-- 4:3 aspect ratio --><div class="embed-responsive embed-responsive-4by3">
  <iframe class="embed-responsive-item" src="..."></iframe></div>

你只需要给ifranme 标签加上 embed-responsive-item属性值,并且在iframe的外部加上<div class="embed-responsive embed-responsive-16by"></div>标签
或者<div class="embed-responsive-item "></div>标签。



转载地址:http://v3.bootcss.com/components/#responsive-embed

Logo

权威|前沿|技术|干货|国内首个API全生命周期开发者社区

更多推荐