Twitter bootstrap 引导3-如何嵌入响应对象

我正在尝试嵌入一个tableau对象，它使用javascript和参数在站点上创建一个iframe

嵌入html的一个例子是

 <script type='text/javascript' src='https://tableau.site.edu/javascripts/api/viz_v1.js'></script>
 <div class='tableauPlaceholder' style='width: 704px; height: 304px;'>
   <object class='tableauViz' width='704' height='304' style='display:none;'>
     <param name='host_url' value='https%3A%2F%site.net.edu%2F' />
     <param name='site_root' value='' /><param name='name' value='DepartmentGoals&#47;DeptGoalsDashboard' />
     <param name='tabs' value='no' /><param name='toolbar' value='no' /></object>
 </div>

我试着按照医生说的做，但是我运气不太好

<div class="tableauPlaceholder embed-responsive embed-responsive-16by9">
       <object class='tableauViz embed-responsive-item' style='display:none;'>
         <param name='host_url' value='https%3A%2F%site.net.edu%2F' />
         <param name='site_root' value='' /><param name='name' value='DepartmentGoals&#47;DeptGoalsDashboard' />
         <param name='tabs' value='no' /><param name='toolbar' value='no' /></object>
</div>

更新

我访问了tableu文档，可以使用直接iframe，而无需使用javascript API和带有参数的对象来创建iframe

所以我更新的代码是这样的，嵌入正确，但是iframe没有响应，它在底部有大量的填充

<div class="row">

    <div align="center" class='embed-responsive embed-responsive-16by9'>
      <iframe class='embed-responsive-item' src="https://tableau.site.edu/views/..." width="704" height="304"></iframe>
    </div>

</div>

---

您的iframe很可能没有响应，因为您正在设置宽度和高度

尝试更类似于：

<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="..."></iframe> <!--note: no width/height in the iframe -->
</div>

---

来源：

对于初学者来说，这不会加载，为什么

style='display:none；'在您的标记中？为了简洁起见，我刚刚将JavaScript部分从我尝试的代码示例中删除…没有显示可防止在对象准备就绪之前闪现未设置样式的内容。您所说的“它仍然不工作”是什么意思。iframe中没有显示任何内容吗？或者你只是不喜欢底部的填充量？尝试将其简化为尽可能简单的内容。如果您删除引导，所有css，只需将iframe嵌入到html包装的裸外壳中，那么它能工作吗？您在浏览器控制台或检查器中获得任何信息吗？抱歉，让我澄清一下，iframe嵌入了，但它没有响应，而且我在底部有一个巨大的pad好的，一个简单的快速测试是更改iframe标记上的src属性，以指向某个非常简单的静态页面，将Tableau服务器排除在图片之外。如果您仍然可以复制该行为，那么您可以尝试在混合中使用一个较少移动的部分对其进行调试。若它开始工作，那个么您就有证据表明它与Tableau服务器和您的HTML、CSS、Javascript进行了一些交互。无论哪种方式，您都会有更多的数据来帮助解决问题。如何使此全屏显示？对于3.3.x：