Getting startedAccessibility（无障碍）Browsers and devices（浏览器和设备）Build tools（构建工具）Contents（内容）Download（下载）JavaScriptTheming Bootstrap（主题Bootstrap）WebpackComponents: AlertsAlerts（警报）Components: BadgesBadges（徽章）Components: BreadcrumbBreadcrumbComponents: Button groupButton group（按钮组）Components: ButtonsButtons（按钮）Components: CardsComponents: CarouselCards（卡）Carousel（圆盘传送带）Components: CollapseCollapse（折叠）Components: DropdownsDropdowns（下拉菜单）Components: FormsForms（表单）Components: Input groupInput group（输入群组）Components: Input groupJumbotron（广告大屏幕）Components: List groupList group（列表组）Components: ModalModal（互动视窗）Components: NavbarNavbar（导航栏）Components: NavsNavs（导航栏）Components: PaginationPagination（分页）Components: PopoversPopovers（弹出框）Components: ProgressProgress（进度条）Components: ScrollspyScrollspy（滚动监听）Components: TooltipsTooltips（提示工具）ContentCode（代码）Figures（图片区）Images（图片）Reboot（重置）Tables（表格）Typography（排版）LayoutGrid（网格）Layout（布局）Media object（多媒体对象）Utilities for layout（排版通用类别）MigrationMigrating to v4（迁移到v4）UtilitiesBorders（边框）Clearfix（清除浮动）Close icon（关闭图标）Colors（颜色）Display property（显示属性）Embeds（内嵌）Flex（弹性）Float（浮动）Image replacement（图像替换）Position（位置）Screenreaders（荧幕阅读器）Sizing（尺寸）Spacing（间隔）Text（文本）Vertical alignment（垂直对齐）Visibility（能见度）
©
本文档使用
php.cn手册 发布
文字
通过创建可在任何设备上缩放的固有比率，根据父级的宽度创建响应式视频或幻灯片嵌入。
关于
规则被直接施加到<iframe>，<embed>，<video>和<object>元件；.embed-responsive-item如果要为其他属性的样式进行匹配，可以使用明确的后代类。
专家提示！你不需要包含frameborder="0"在你的<iframe>s中，因为我们会为你覆盖。
示例
将任何嵌入内容嵌入到具有纵横比<iframe>的父元素中.embed-responsive。.embed-responsive-item并非严格要求，但鼓励使用。
<div class="embed-responsive embed-responsive-16by9"> <iframe class="embed-responsive-item" src="https://www.youtube.com/embed/zpOULjyy-n8?rel=0" allowfullscreen></iframe></div>
纵横比
宽高比可以使用修饰符类自定义。
<!-- 21:9 aspect ratio --><div class="embed-responsive embed-responsive-21by9"> <iframe class="embed-responsive-item" src="..."></iframe></div><!-- 16:9 aspect ratio --><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><!-- 1:1 aspect ratio --><div class="embed-responsive embed-responsive-1by1"> <iframe class="embed-responsive-item" src="..."></iframe></div>