iframe背景色为父DIV的方法

最新推荐文章于 2022-06-09 17:08:57 发布
最新推荐文章于 2022-06-09 17:08:57 发布
阅读量2.1k 收藏
点赞数
文章标签： iframe div safari firefox opera chrome
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/bvb09/article/details/4314189
版权

被这个问题卡了一天，除了IE 别的浏览器（opera firefox safari chrome）都解决了

只要在b.html页面的<body>设置样式就OK了
<body style="background:transparent;">
对比下面2张图
设置前的页面
设置前的页面
设置后的页面
设置后的页面
bvb09
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
修改iframe子页面,使其背景色与父页面一致
牛牛的空间
12-11 1050
只需要在&lt;iframe&gt;中加style="filter:chroma(color=#ffffff)"   就可以使其一致
解决IE下iframe页面颜色和父页面颜色不一样的bug
haogangshang的专栏
04-08 165
      公司做项目时碰到一个很棘手的问题，在IE下iframe页面和父页面的背景颜色不一样，css根本不起作用，弄了半天，最后在网上终于找到了解决方案。原来在IE下Iframe的背景色不是透明的，所以Iframe会 出现是白色的情况。 解决方案：      第一步：在iframe中添加 allowtransparency="true"属性（只添加allowtransparency也行...
使iframe里面引用页透明，显示主页面的背景图片
0.0 空间
07-28 1071
 main.htm         ALLOWTRANSPARENCY="true" >             iframe.htm           STYLE="background-color:transparent">       Transparent.            
iframe背景色
顾传龙
07-09 2214
用iframe引用同一个页面,但想让这个页面在不同的引用中有不同的背景色： 一、可以使用iframe的透明来实现：   1、给放置iframe的容器设置你要的背景，比如table的单元格   2、把iframe设置为允许透明   3、设置iframe包含的页面背景为透明   这样以来，就可以通过控制单元格的背景色来达到需要的效果了   代码：   main.htm
可爱的iframe+div
05-25
开发者可以使用CSS为div设置样式，如背景色、边框、内边距和外边距，从而创建各种复杂的网页布局。通过组合多个div，我们可以实现响应式设计，适应不同的设备屏幕尺寸。 在"可爱的iframe+div"的场景中，可能是指...
html div+Iframe
03-16
2. **样式应用**：可以为`div`添加CSS样式，如背景色、边框、内边距和外边距，实现复杂的布局效果。 3. **类与ID**：通过`class`或`id`属性，`div`能被特定的CSS或JavaScript选中，实现定制化的样式和行为。 4. **...
js获取及修改网页背景色和字体色的方法
10-23
首先，要获取网页元素的背景色或字体色，可以使用JavaScript的`document.getElementById()`方法来选取指定ID的元素，然后通过`.style.backgroundColor`或`.style.color`属性获取相应的颜色值。这些属性返回的颜色...
div+css代替iframe框架并带全屏遮罩加载特效
01-24
要实现这一效果，可以创建一个全屏的`div`，设置其背景色为半透明黑色，然后利用`CSS`的`position`属性将其定位在页面顶部，并设置`z-index`确保其位于其他元素之上。当页面加载完成后，通过JavaScript或jQuery来...
关于flash遮盖div浮动层的解决方法
09-05
var so = new SWFObject("XXX.swf", "flashId", "宽度", "高度", "版本", "背景色"); // 设置Flash不遮盖Div层 so.addParam("wmode", "opaque"); so.write("flashcontent"); ``` 这段代码使用SWFObject创建了...
layui弹出层 iframe子页面的背景层覆盖父级页面
热门推荐
卡卡罗特的博客
02-01 1万+
项目中运用了iframe,子页面显示。但是在使用layui的插件时，弹出层背景自覆盖当前的iframe区域，并不是覆盖了整个页面。 要实现覆盖整个页面，这里就需要用到layui中的方法，parent.layer.open({}）。在父级页面打开弹出层。具体操作如下： 注意：在外面的父级页面和iframe里面的子页面都需要，引用layui.js和layui.css 第一步：子页面中调用pare
js弹出窗口
bvb09的
12-18 1053
 function get_cookie(Name) { var search = Name + "="; var returnvalue = ""; if (document.cookie.length > 0) {  offset = document.cookie.indexOf(search);   if (offset != -1) { // 如果以前有coo
日程安排组件dhtmlxScheduler
bvb09的
12-18 1万+
 dhtmlxScheduler是一个相当不错的日程组件，经过一星期，终于折腾出了个java版的基本应用demo里都有的直接上关键的部分汉化 日期显示格式改这里的代码dhtmlxscheduler.jsscheduler.locale={ date:{  month_full:["1月","2月","3月","4月","5月","6月","7月","8月","9月","
html iframe 子页面调用父页面的方法
小小的熊的博客
05-08 1110
还是附上代码吧。不多说，方便日后查看 父页面代码： <!DOCTYPE html> <html> <head> <title>parents</title> <meta charset="UTF-8"> </head> <body> <script language="jav...
docker run -it 和 docker exec -it具有什么功能呢？
qq_25073223的博客
06-09 488
docker run的功能简介说明
[html] iframe可以使用父页面中的资源吗（如：css、js等）？
歌谣的博客
04-13 884
[html] iframe可以使用父页面中的资源吗（如：css、js等）？ iframe 属于一个单独的文档不能直接使用父页面的资源，css的层叠不会影响iframe iframe如果和父页面同域则可以在iframe中使用parent对象来使用父页的js对象 个人简介 我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易， 但坚持一定很酷。欢迎大家一起讨论 主目录 与歌谣一起通关前端面试题 ...
js判断div高度及设置父窗口iframe高度
linqin27的博客
01-19 4505
Javascript如何获取和设置div的高度和宽度，并且兼容任何浏览器？看代码： http://www.itdos.com http://www.itdos.com 获取div1的宽高度： alert(document.getElementById("div1").offsetHeight);  //兼容FF、IE等 alert(document.getElement
vue修改iframe的背景颜色
最新发布
09-14
要修改Vue中iframe的背景颜色，你可以采取以下步骤： 1. 首先，在Vue组件中找到包含iframe的标签或元素，并为其添加一个唯一的id，方便后续操作。例如，你可以给iframe所在的div元素添加一个id="my-iframe"。 2. 接下来，在Vue组件的methods选项中编写一个方法，用于修改iframe的背景颜色。你可以称此方法为changeIframeBgColor()。 3. 在这个方法中，你可以通过获取到iframe的DOM元素，使用Vue的$refs属性来实现。在changeIframeBgColor()方法中添加以下代码： ```javascript changeIframeBgColor() { const iframeElement = this.$refs.myIframe.contentDocument.body; iframeElement.style.backgroundColor = 'red'; } ``` 这段代码中，我们通过this.$refs.myIframe获取到了id为"my-iframe"的元素，然后使用contentDocument获取到了iframe的文档对象。最后，我们将iframe的背景颜色设置为红色。 4. 最后，在Vue组件的模板中，将changeIframeBgColor()方法绑定到一个按钮或其他事件上，以触发修改背景颜色的操作。例如： ```html <div id="my-iframe"> <iframe ref="myIframe" src="http://example.com"></iframe> <button @click="changeIframeBgColor">修改背景颜色</button> </div> ``` 在这个例子中，我们在按钮上添加了点击事件，点击按钮就会触发changeIframeBgColor()方法，从而修改iframe的背景颜色为红色。 请注意，为了获得正确的元素引用，需要确保iframe的加载是同步的，并且iframe与Vue组件在同一个域中。如果跨域，可能会遇到安全限制。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值