我的问题类似于IFRAME和冲突的绝对位置,但我特别想知道为什么你不能在iframe中设置左/右或上/下并让它工作.
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
iframe { position: absolute; display: block; top: 0; bottom: 0; left: 10px; width:100px; border: 1px solid black;}
div { position: absolute; display: block; top: 0; bottom: 0; left: 200px; width:100px; border: 1px solid black;}
</style>
</head>
<body>
<iframe></iframe>
<div></div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
div占用了完整的浏览器高度.iframe高150px.在Chrome 17,Firefox 11和IE9中也是如此.显然这不是浏览器的怪癖.HTML5规范中有一些内容表示您无法在iframe上设置左/右或上/下以设置高度.
关于iframe(与divs)有什么特别之处?
Sve*_*der 23
它不会成功.这就是iFrame的制作方式.
如果你仍然想要达到相同的解决方案,那么你使用div作为绝对位置的包装器,你的顶部,左侧,右侧,底部.把你的iFrame宽度宽度:100%和高度:100%放入div中.
问题解决了.
use*_*621 20
iframe是"替换元素".
这些处理方式与未替换元素的处理方式不同.无需详细说明,只需查看规范的目录:http://www.w3.org/TR/CSS21/visudet.html
10.3计算宽度和边距
10.3.1在线,未替换元素
10.3.2在线,替换元素
10.3.3正常流程中的
块级非替换元素10.3.4 正常流程中的块级替换元素
10.3.5浮动,未替换元素
10.3.6浮动,替换元素
10.3.7绝对定位,未替换元素 // div
10.3.8绝对定位,替换元素 // iframe
10.3.9'内联块',未替换元素在正常流程中
10.3.10'内联块',在正常流程中替换元素
| 归档时间: |
|
| 查看次数: |
9601 次 |
| 最近记录: |