是否有可能改变一个div的风格,居住在一个iframe在页面上使用CSS只?


当前回答

只要添加这个,一切都很好:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

其他回答

简单的回答是:不,对不起。

仅仅使用CSS是不可能的。你基本上需要控制iframe内容,以便对它进行样式化。有一些方法使用javascript或你选择的web语言(我读过一点,但我自己不熟悉)来动态插入一些所需的样式,但你需要直接控制iframe内容,这听起来好像你没有。

结合不同的解决方案,这对我来说是有效的。

$(document).ready(function () {
    $('iframe').on('load', function() {
        $("iframe").contents().find("#back-link").css("display", "none");
    }); 
});

从客户端不可能。一个javascript错误将被提出“错误:权限拒绝访问属性“文档””,因为Iframe不是你的域的一部分。 唯一的解决方案是从服务器端代码中获取页面并更改所需的CSS。

显然,它可以通过jQuery完成:

$('iframe').load( function() {
    $('iframe').contents().find("head")
      .append($("<style type='text/css'>  .my-class{display:none;}  </style>"));
});

https://stackoverflow.com/a/13959836/1625795

您可以先检索iframe的内容,然后像往常一样对它们使用jQuery选择器。

$("#iframe-id").contents().find("img").attr("style","width:100%;height:100%")

$("#iframe-id").contents().find("img").addClass("fancy-zoom")

$("#iframe-id").contents().find("img").onclick(function(){ zoomit($(this)); });

好运!