正文 

当前位置： 首页 > 问答 >

如何将 css 样式应用到 iframe 内容中？ [复制]

     2023-03-05     7

关键词：

【中文标题】如何将 css 样式应用到 iframe 内容中？ [复制]【英文标题】：How to applying css style into an iframe content? [duplicate] 【发布时间】：2013-03-26 15:07:12 【问题描述】：

我正在尝试为 iframe 中的内容应用 CSS 样式，请查看此链接 http://jsfiddle.net/pPqGe/

jQuery:

$(document).ready(function() 
    $('iframe').contents().find('h1').css('color','red');
);

HTML：

<iframe src="mysite"   id="myframe"></iframe>

对于 iframe 源，我使用了一个实时网站。

【问题讨论】：

您可以将它们作为查询字符串传递给 iframed 页面。 shnisaka 是对的，否则是不可能的。出于安全原因，浏览器带有该限制，称为“跨域脚本”。 如果您正在调用位于同一域中的另一个网页，则只需使用 ajax 调用该页面内容。 【参考方案1】：

它有效。问题是没有H1，只有H2。 查看此链接http://jsfiddle.net/pPqGe/1545/。

HTML：

<iframe src='jsfiddle.net'></iframe>

JavaScript：

$(document).ready(function() 
    $('iframe').contents().find('h2').css('color','red');
    $('iframe').contents().find('#header').css('opacity','.2');
);

【讨论】：

是的，你是对的。它在 jsfiddle 中运行良好，但我正在为 iframe 使用另一个源文件。 例如：" " 不支持。。标题类在smasingmagazine上可用，但不受影响。

Fancybox iframe 内容 - 如何从父级访问 CSS？

】Fancyboxiframe内容-如何从父级访问CSS？【英文标题】：Fancyboxiframecontent-howtoaccessCSSfromparent?【发布时间】：2011-10-3119:58:06【问题描述】：我正在从加载了多个样式表的页面中打开Fancyboxiframe。iframe中的内容来自我自己的应用程序... 查看详情

有没有办法将编写在代码镜像中的 css 应用于 iframe 的 html 内容？

】有没有办法将编写在代码镜像中的css应用于iframe的html内容？【英文标题】：Isthereawaytoapplycsswritteninacodemirrortothehtmlcontentsofaniframe?【发布时间】：2019-11-3016:33:06【问题描述】：我有两个代码镜像文本区域，一个用于html，一个用... 查看详情

尝试使用 JavaScript 将 css 样式添加到 iframe

】尝试使用JavaScript将css样式添加到iframe【英文标题】：TryingtoaddcssstylingtoiframewithJavaScript【发布时间】：2021-01-1403:36:14【问题描述】：在Wordpress上试试这个：在我的iframe中，我有一个._2p3a类，我想将其宽度更改为._2p3awidth:100%!impor... 查看详情

如何将 iframe 的内容复制到弹出窗口中？

】如何将iframe的内容复制到弹出窗口中？【英文标题】：Howtocopycontentofiframeintopopupwindow?【发布时间】：2011-07-2608:09:23【问题描述】：有没有办法将iframe的内容复制到jQuery的弹出窗口中？$(popUpWindow.document).append($(\'#iframe1\').contents(... 查看详情

css学习摘要-引入样式

...式注：主要是摘录自MDN网络开发者这个网站的。CSS实际上如何工作？当浏览器显示文档时，它必须将文档的内容与其样式信息结合。它分两个阶段处理文档：浏览器将HTML和CSS转化成DOM（文档对象模型）。DOM在计算机内存中表示... 查看详情

iframe更改内容CSS样式[重复]

】iframe更改内容CSS样式[重复]【英文标题】：IframeChangeContentCSSStyle[duplicate]【发布时间】：2013-05-1513:08:34【问题描述】：我的网页中确实有一个iframe，但我想更改css/字体样式等。<iframename=\'iframe1\'id="iframe1"src=\'<?phpecho"http://mic... 查看详情

如何将 CSS 包含到 IntraWeb 项目中？

】如何将CSS包含到IntraWeb项目中？【英文标题】：HowtoincludeCSSintoaIntraWebProject?【发布时间】：2014-09-2323:59:57【问题描述】：说明：我通过“IntraWeb应用程序向导”创建了一个新的独立IntraWeb应用程序，我在里面放置了一些带有事件... 查看详情

如何将 <iframe> HTML 代码嵌入到 C# 应用程序中？

】如何将<iframe>HTML代码嵌入到C#应用程序中？【英文标题】：HowcanIembed<iframe>HTMLcodeintoC#application?【发布时间】：2015-03-0608:11:27【问题描述】：如何最有效地将HTMLiframe嵌入到我的c#应用程序中。让我们说这个youtube视频：&l... 查看详情

如何扩展 iFrame/将内容从 iFrame 移动到 div？ [复制]

】如何扩展iFrame/将内容从iFrame移动到div？[复制]【英文标题】：HowtoextendiFrame/movecontentsfromiFrametodiv?[duplicate]【发布时间】：2014-06-2304:22:08【问题描述】：我有一组将页面内容加载到iframe的链接。该iframe只有父div的高度，如果需要... 查看详情

如何使用 Ajax 将表单定位到 iframe？

】如何使用Ajax将表单定位到iframe？【英文标题】：HowtotargetformtoiframewithAjax?【发布时间】：2015-09-0712:20:06【问题描述】：我还是jQuery的新手，所以我无法自己弄清楚所有内容。我有简单的form用于上传图像，progressbar的jQuery插件，... 查看详情

iframe如何使用javascript替换内容？

...更改反应在iframe中，比如，修改了样式、或HTML代码，该如何实现呢？我希望只刷新iframe元素就可以完成，而不是再重新加载页面。有没有方法，可以完全替换掉iframe的css、js、html代码，而不用与服务器交互？只在客户端就完成... 查看详情

CSS：将 CSS 样式应用于除 Material Angular 之外的所有内容

...MaterialAngular【发布时间】：2020-11-2323:16:39【问题描述】：如何将CSS样式（justify-content:center或box-sizing:border-box应用于所有子元素和孙子元素，除了任何Material且以我们实际上将有500多个元 查看详情

如何将 swf 文件嵌入到网站上的浮动 iframe 中。书签？

】如何将swf文件嵌入到网站上的浮动iframe中。书签？【英文标题】：Howtoembedswffileinfloatingiframeonwebsitevia.bookmarklet?【发布时间】：2019-08-2300:25:35【问题描述】：我是一名高中生，也是小书签的新手。我想要一个可以在网站顶部制... 查看详情

如何知道 CSS 样式是不是完全应用于动态添加的内容

】如何知道CSS样式是不是完全应用于动态添加的内容【英文标题】：Howtoknowifcssstylewasfullyappliedtodynamiclyaddedcontent如何知道CSS样式是否完全应用于动态添加的内容【发布时间】：2013-02-0712:06:12【问题描述】：案例：内容被动态添加... 查看详情

如何将html样式标签提取到css中

】如何将html样式标签提取到css中【英文标题】：Howtoextracthtmlstyletagintocss【发布时间】：2020-12-1020:53:51【问题描述】：我正在尝试从divhtml中自动提取标签样式的一部分。我有100种样式组合，因此无法手动进行。这是路径html样式... 查看详情

将清除后的 tailwindcss 加载到 iFrame

...个vuejs组件，我在iFrame中渲染一个动态组件，但我不知道如何在其中加载我的tailwindcss文件......目前我正在创建一个额外的css文件，在其中手动添加我需要的所有样式。我使用原始加载程序加载此文件，然后将字符串附 查看详情

如何跨域更改 iframe 内容的样式？

】如何跨域更改iframe内容的样式？【英文标题】：Howtochangestyleofiframecontentcross-domain?【发布时间】：2011-06-1103:03:38【问题描述】：我想将iframe内的内容的背景颜色设置为黑色，文本颜色设置为白色，而不是默认的普通白色背景和... 查看详情

如何将 CSS 样式应用到我的 <Loader /> React 组件？

】如何将CSS样式应用到我的<Loader/>React组件？【英文标题】：HowtoapplyCSSstylestomy<Loader/>Reactcomponent?【发布时间】：2022-01-1912:30:06【问题描述】：我有一个为我的ReactWeb应用程序编写的按钮代码。我有一个三元运算符，如果... 查看详情