html - 如何使IFRAME的大小与容器的大小一致?

标签 html iframe

<td width="120" valign="top" height="100%">
   <iframe src="menu.php" width="100%" height="100%" frameborder="0">
   </iframe>    
</td>

此代码始终给出浏览器中 iFrame 的默认大小(与:

<iframe src="menu.php">
</iframe>

) 我希望 IFrame 获取容器单元格的大小。

我知道我可以使用 PHP 来在该位置包含一个文件,但我想创建一个带有滚动条的长菜单。实现此目的的另一种解决方案也很好,因为就我个人而言,我不喜欢 IFrame。

谢谢

伊万

编辑: 现在我已经得到了这个,但它不显示 div:

<html> 
<head > 
    <title>Untitled Page</title> 
    <style type="text/css"> 
        .scroller { height:100%; overflow:auto; }
    </style> 
</head> 
<body style="background-color: #7C70DA; font-family: Fixedsys, Courier, Courier New; text-align:center; vertical-align:center;"> 
    <center> 
        <div style="position:absolute; left: 40px; right:40px; top: 40px; bottom:40px; background-color: #3931A5; vertical-align:middle; color: #7C70DA "> 
            <table border="0"> 
                <tr> 
                    <td width="160" valign="top" height="100%"> 
                        <div class="scroller"> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 
                            Lipsum <br /> 

                        </div>  
                    </td> 
                    <td width="100%" valign="top"> 

                    </td> 
                </tr> 
            </table> 
            <br /> 
            (c) YVAN JANSSENS 2010      </div> 
    </center> 
</body> 
</html> 

最佳答案

您可以将菜单内容放在div中,设置div的高度,以及overflow value自动或滚动。作为旁注,我想鼓励您放弃在 HTML 中使用表格,而是考虑像 960 Grid System 这样的 CSS 框架。用于您的布局。

.scroller { height:500px; overflow:auto; }

--

<div class="scroller">
  <ul>
    <li>Options</li>
    <li>Options</li>
    <li>Options</li>
    <li>Options</li>
    <li>Options</li>
    <li>Options</li>
  </ul>
</div>

关于html - 如何使IFRAME的大小与容器的大小一致?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2140659/

相关文章:

python-3.x - 使用 Python selenium 单击 iframe 元素

javascript - 强制内部 iframe 内容在页面加载时滚动到顶部

html - 如何用一个元素创建 3D 透视图像?

javascript - jQuery 更新父项上的类

iframe - facebook like box 外部 css

javascript - 当 iframe 加载来自链接的内容时,滚动将与索引页面一起加载并消失

javascript - jquery查找并替换iframe src

javascript - 用 Javascript 构建 HTML 字符串真的不安全吗?

javascript - 使用 PHP 检索上传的 Blob

javascript - When option in select list doesn't fix into select width it's value is trimmed if we select it