如何在iframe中定位图像

Question

如何使用CSS在iframe中定位图像？

这不起作用

iframe img {
    height: auto;
    width: 100%;
}

Answer 1

为此尝试jquery

$('iframe').contents().find('img').css({width: '100%', 'height': '100%'});

如果iframe在页面加载后加载

，则将其包装在jQuery加载回调中

$('iframe').load(function() {
    $(this).contents().find('img').css({width: '100%', 'height': '100%'});
})

Answer 2

这是一个常见问题，但答案是相同的，你无法使用css或jquery访问<iframe>中的内容。

如果您有权访问<iframe>中使用的页面，请在该页面上编写css，然后它将自动在<iframe>中运行。但你不能用<iframe>改变外部代码中的任何内容。

Answer 3

在同一个域下尝试此操作。否则会引发交叉原点错误。

使用On load jQuery函数进行更新。

$('iframe').on("load", function () {

    $(this).contents().find('img').css({width: '100%', 'height': '100%'});

});

Answer 4

document.querySelector('iframe[name="content2"]').contentWindow.addEventListener('load',function(e){e.target.body.style.textAlign='center'},false)