是否有可能改变一个div的风格，居住在一个iframe在页面上使用CSS只?
当前回答
你需要JavaScript。这与在父页面中执行相同，只是必须在JavaScript命令前加上iframe的名称。
请记住，应用同源策略，因此只能对来自您自己服务器的iframe元素执行此操作。
我使用Prototype框架来简化:
frame1.$('mydiv').style.border = '1px solid #000000'
or
frame1.$('mydiv').addClassName('withborder')
其他回答
是的。看看另一个线程的细节: 如何将CSS应用到iframe?
const cssLink = document.createElement("link");
cssLink.href = "style.css";
cssLink.rel = "stylesheet";
cssLink.type = "text/css";
frames['frame1'].contentWindow.document.body.appendChild(cssLink);
// ^frame1 is the #id of the iframe: <iframe id="frame1">
简单的回答是:不，对不起。
仅仅使用CSS是不可能的。你基本上需要控制iframe内容，以便对它进行样式化。有一些方法使用javascript或你选择的web语言(我读过一点，但我自己不熟悉)来动态插入一些所需的样式，但你需要直接控制iframe内容，这听起来好像你没有。
您可以先检索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)); });
好运！
显然，它可以通过jQuery完成:
$('iframe').load( function() {
$('iframe').contents().find("head")
.append($("<style type='text/css'> .my-class{display:none;} </style>"));
});
https://stackoverflow.com/a/13959836/1625795
只要添加这个，一切都很好:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
