Css 将iframe放在一个“"；相框；，或如何；“框架”；iframe_Css_Iframe

Css 将iframe放在一个“"；相框；，或如何；“框架”；iframe

css iframe

Css 将iframe放在一个“"；相框；，或如何；“框架”；iframe,css,iframe,Css,Iframe,我真的没有任何参考资料，也没有示例代码（在Google&SO中搜索）。也许只是没有找到正确的关键词我相信这可以/必须用CSS解决，但我的技能是最低限度的也就是说：我想在iframe中“裁剪”若干像素一开始是顶部和底部，但是，嘿，如果我要问的话，也要问左右：o） [更新] 我真正想要的是一个“概念证明”，或者至少是一个开始的代码 [根据David的回答，概念已经验证] <!DOCTYPE html> <html> <head><title&g

我真的没有任何参考资料，也没有示例代码（在Google&SO中搜索）。
也许只是没有找到正确的关键词

我相信这可以/必须用CSS解决，但我的技能是最低限度的

也就是说：
我想在iframe中“裁剪”若干像素一开始是顶部和底部，但是，嘿，如果我要问的话，也要问左右：o）

[更新]
我真正想要的是一个“概念证明”，或者至少是一个开始的代码

[根据David的回答，概念已经验证]

<!DOCTYPE html>
<html>
<head><title>iframe cropping</title>
    <style type="text/css">
    <!-- 
    #iframeparent{width:700px;height:700px;}
    iframe{margin-top:-40px;width:700px;height:700px;overflow:hidden;border:0px;}
    #iframe-crop{position:absolute;top:0;left:0;border-top:55px solid white;width:710px;height:640px;pointer-events:none;}
    -->
    </style> 
</head>
<body>
    <div id="iframeparent">
        <iframe src="http://docs.google.com/viewer?url=http://www.startupgreece.gov.gr/sites/default/files/geek_agreement_v1.2.pdf"></iframe>
        <div id="iframe-crop"></div>
    </div>
</body>
</html>


iframe裁剪

我会在iframe的顶部直接放置一个带有白色（或网站背景色的任何颜色）边框的块，并根据要裁剪的大小调整每个边框的大小。最简单的方法是将iframe放在相对定位的父元素中（或者说不是静态的），然后将剪切边框也放在父元素中，绝对定位在

顶部：0

和

左侧：0

。裁剪块必须与iframe的尺寸相同（iframe是否有专用尺寸？）

编辑：刚刚尝试过，我发现（duh！）这会禁用与iframe的所有交互，因为裁剪覆盖“吸收”所有事件。如果你不介意的话，很好。如果没有，您可以尝试CSS属性

指针事件：无，但这不会在所有浏览器中都起作用。它可以在Firefox、Chrome和IE的最新版本中工作，但并非所有人都使用最新版本的所有内容
演示：
你好，大卫。我真的不想免费进入分类代码，但正如我所说的，我没有CSS技能（当然我可以阅读并更改内容，但我在定位时经常遇到麻烦）。。。我会更新我的问题，谢谢！刚刚看到您的编辑，在iframe上放一个
怎么样。。。嗯，图像可能也会破坏互动性，不是吗？添加了一个演示链接。似乎没有从底部和右侧裁剪，我正在努力。我看不出有什么帮助。我修复了底部和右侧没有修剪的问题。这与添加边框时元素的大小增加有关。您只需摆弄裁剪元素的大小。我建议您使用浏览器的元素检查器来计算每个元素的大小。Chrome的特别好，Firefox的Firebug也是如此。