Question

尝试iframe网站的一部分（http://edmontontrafficcam.com），即地图＆amp;视频div ..

我的iframe代码是通过CSS自定义的，用于包含Map＆amp; Video Div。但是在加载iframe时，视频会显示在地图下方，并且不可见。我想要网站的确切视图，视频在右边对齐，没有滚动条。

点击地图，我将重点放在视频上，之后我需要重新加载网站以获取地图视图。

<div 
style="overflow: hidden; margin: 15px auto; width: 1800px;"  > 
<iframe src="http://edmontontrafficcam.com/" style="
border: 0px none; 
margin-left: 20px;
margin-top: -200px;
margin-right: -900px; 
height: 850px;  
width: 850px;"> 
</iframe> 
</div>

有关如何按照网站上的说明保持div对齐的任何建议吗？

Answer 1

在我的HTMl中，以下代码给出了我认为你想要的结果。如果我错了，请纠正我。

代码：

<div 
  style="
    overflow: hidden;
    margin: 15px auto;
    width: 1800px;
  "> 
  <iframe src="http://edmontontrafficcam.com/" 
  style="
    border: 0px none; 
    margin-left: -1000px;
    margin-top: -220px;
    margin-right: -900px; 
    height: 900px;  
    width: 1400px;
  "> 
  </iframe> 
</div>

Answer 2

您需要增加iframe的width以匹配父div（最好超过992px），因为您提到的行为（“我失去了对视频的关注”）是其中的一部分实际的网站。如果你在那里缩小页面，你可以找到相同的内容。

<div> 
  <iframe src="http://edmontontrafficcam.com" 
          style="border: 0px none;
                 width: 1000px;
                 height: 900px;
                 margin-left: 20px;
                 margin-top: -200px;
                 margin-right: -900px;">
  </iframe>
</div>

如何在iFrame中对DIV进行相同的对齐？

2 个答案: