如何去掉iframe内嵌页面头部/底部（iframe取部分网页）

最新推荐文章于 2023-12-28 17:46:16 发布
最新推荐文章于 2023-12-28 17:46:16 发布
阅读量9.4k 收藏 3
点赞数 3
分类专栏： 前端 文章标签： iframe
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37542292/article/details/82420936
版权

请看如下代码 红色部分就是你需要加进去的
<iframe style="margin-top:-150px;width:950px;display:block;" frameborder="0" marginheight="0" marginwidth="0" border="0" id="alimamaifrm" name="alimamaifrm" scrolling="no" height="2000px" width="100%" src="http://pindao.huoban.taobao.com/tms/channel/onsale.htm?pid=mm_10067787_2211697_8954836&eventid=101586"></iframe>

注: 代码中绿色部分可以自己调整
margin-top:-150px 头部想隐藏的更多一点 150就增加一点 
height="2000px" 想隐藏底部呢 就把2000减小一点
 

老羊头博客
关注
  • 3
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
JS动态修改iframe内嵌网页地址的方法
10-24
主要介绍了JS动态修改iframe内嵌网页地址的方法,涉及javascript动态修改iframe中src属性的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
HTML阻止iframe跳转页面并使用iframe在页面内嵌微信网页版的实现方法
09-28
就想弄一个winform结合html5的一个小东西，突有心血来潮，想在里面嵌套一个微信网页版，下面小编给大家介绍下HTML阻止iframe跳转页面并使用iframe在页面内嵌微信网页版的实现方法，一起看看吧
使用iframe标签嵌入第三方网页并隐藏网页头部导航栏和底部网页信息
Nicerlee的博客
11-29 7357
1、解决方案 通过对<div>标签高度控制来隐藏第三方页面底部内容，设置<iframe>标签中的margin-top上部边距来隐藏页面的头部导航栏信息等。 代码实现(以百度首页展示为例)： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style&gt...
iframe 引入第三方页面，并去掉页面的导航栏和下半部分，只显示部分页面的方法
weixin_51192038的博客
03-06 6350
iframe 引入第三方页面，并去掉页面的导航栏和下半部分，只显示部分页面的方法 我用的elementui 画的页面，和html一样 用iframe引入第三方页面 （1）src 里面写要引入的第三方页面的链接 （2）iframe 一定要放在div里面，最外层div的position =relative，里层的div的position=adsolute （3）去掉头部的内容，可以直接在`里层的div中的margin-top设置，margin-top = -122px，这个-122px 可以根据自己的需求
BIEE报表嵌入Iframe（报表引入到前端页面中，并去除报表的title）
泡沫在飞的博客
04-23 741
BIEE报表嵌入Iframe（报表引入到前端页面中，并去除报表的title） 文档参考博客地址： http://blog.sina.com.cn/s/blog_6fbd6e050101bmo5.html 在安装路径下找到{Oracle_Home}\user_projects\domains\bi\config\fmwconfig\biconfig\OBIPS\ instanceconfig.xml， <Security> <InIFrameRenderingMode&g...
iframe嵌入网页如何实现隐藏部分内容
qq_35641191的博客
12-28 1004
iframe嵌入网页如何实现隐藏部分内容
jQuery中弹出iframe内嵌页面元素到父页面并全屏化的实例代码
10-20
主要介绍了jQuery中弹出iframe内嵌页面元素到父页面并全屏化的实例代码,需要的朋友可以参考下
js判断iframe内的网页是否滚动到底部触发事件
10-23
主要介绍了js判断iframe内的网页是否滚动到底部触发事件,需要的朋友可以参考下
iframe用法
xinyihhh的博客
09-14 303
iframe用法
iframe标签的使用（隐藏操作栏）
weixin_45977625的博客
09-20 8342
iframe标签的基本使用 iframe标签在预览pdf文档时，顶部默认会有一行操作栏，可供用户下载、打印等。因在工作中遇到过一次这样的需求，需要控制用户的下载权限，网上大部分是说iframe无法控制，都推荐用pdf.js插件，但我总感觉应该可以的，功夫不负有心人，最终还是被我找到了，此方法基本可行，特此记录 一、基本用法 <iframe ref="iframe" height="700" width="100%" :src="pdfurl"
JS 创建iframe，移除iframe中所不需要的元素
丶扁扁的糖是扁的 的博客
04-19 6629
创建iframe 设置基础属性，并添加onload事件，捕获iframe的加载完成进行回调。 /** * @description: 配置及引入iframe * @return void */ setNewIframe() { let iframe = document.createElement('iframe') iframe.src = '' iframe.height = 500 iframe.width = '100%' iframe.id = 'doc_if..
vue侧栏菜单的无限嵌套
Ironhide的博客
08-05 1207
先看效果： 在权限管理中，可更改任意菜单的路由路径(path)、组件(component)、重定向(redirect) 等属性，也可自定义权限(菜单) 的层级关系（在本文中权限与菜单的意义是一样的） 如何实现该方案： 将所有的路由对象都存放在数据库中，在每次加载页面前去获取菜单数组，菜单数组需要赋值给两个组件，一个是页面侧栏 el-menu ，一个则是 vue-router；在第一张图的权限管理页面中又是一次独立的查询，不管菜单隐藏或禁用与否，全部查出来。 el-menu 负责展示(其中el-menu
iframe嵌套其它网站页面及相关知识点详解
热门推荐
Quentin0823的博客
01-31 2万+
在一个页面中嵌套另外一个页面，就要使用到框架 标签。 标签规定一个内联框架。一个内联框架被用来在当前 HTML 文档中嵌入另一个文档。
iframe隐藏头部的toolbar
weixin_45781661的博客
10-12 3211
iframe隐藏头部的toolbar 隐藏此工具条，只需要在iframe的src中加入’#toolbar=0’，就可以了，代码如下 <iframe :src="resourceurl + '#toolbar=0'" ></iframe>
隐藏iframe的顶部操作栏
qq_38181746的博客
09-07 1557
隐藏iframe的顶部操作栏 在iframe中预览pdf顶部会有一行操作栏，里面有打印，但是我只想让他预览不让打印，打印另做处理 在iframe标签中的预览地址后面加上#toolbar=0 效果
iframe内嵌页面自适应
最新发布
05-28
当使用iframe在页面中嵌入其他网页时，嵌入的页面可能会超出iframe的大小，导致页面显示不完整。为了解决这个问题，可以使用一些技巧来实现iframe内嵌页面自适应： 1. 设置iframe的高度为auto，让它自适应内容的高度： ```html <iframe src="http://example.com" frameborder="0" scrolling="no" style="width: 100%; height: auto;"></iframe> ``` 2. 使用JavaScript动态调整iframe的高度，让它始终与内容保持一致： ```html <iframe id="myFrame" src="http://example.com" frameborder="0" scrolling="no" style="width: 100%;"></iframe> <script> var myFrame = document.getElementById('myFrame'); myFrame.onload = function() { myFrame.style.height = myFrame.contentWindow.document.documentElement.scrollHeight + 'px'; }; </script> ``` 3. 使用媒体查询和CSS缩放来自适应内嵌页面的大小： ```html <iframe src="http://example.com" frameborder="0" scrolling="no" style="width: 100%;"></iframe> <style> @media only screen and (max-width: 768px) { iframe { transform: scale(0.7); transform-origin: 0 0; width: 142.8571428571429%; } } </style> ```

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值