zoukankan      html  css  js  c++  java
  • iframe框架嵌套技巧(全屏,去双滚动条)

    一般情况下我们很少用到iframe(框架),但有些特殊的情况下我们不得不使用iframe,那么或许或遇到嵌套内容不全屏,网页周围有边框,双滚动条等等情况,下面来说一下处理技巧。

    全屏与边框处理:

    <html>  
    <head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Colin-iframe Test</title>
    </head>
    <body>  
    <iframe src="https://www.baidu.com" height="100%" width="100%" id="frame_full" frameborder="0" scrolling="auto"></iframe>
    </body>
    </html>
    

      

    基本可以满足需求了吧,或许你细心使用会发觉还是不够完美,因为过高的页面会有双滚动条,怎么办?

    <html>  
    <head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Colin-iframe Test</title>
    </head>
    <body>  
    <iframe src="https://www.baidu.com" height="100%" width="100%" id="frame_full" frameborder="0" scrolling="auto"  onload="this.style.height=document.body.clientHeight-50"></iframe>
    </body>
    </html>
    

      

    这样是不是没有了?

    当然,还可以这样:

    <html>  
    <head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Colin-iframe Test</title>
    <style type="text/css">
        html{overflow:hidden;}
    </style>
    </head>
    <body>  
    <iframe src="https://www.baidu.com" height="100%" width="100%" id="frame_full" frameborder="0" scrolling="auto" ></iframe>
    </body>
    </html>
    

      

    -完-

    博客地址:http://www.cnblogs.com/colinliu/
    博客版权:本文以学习、记录、分享为目的。欢迎大家转载,但务必注明原文地址,谢谢合作!
  • 相关阅读:
    UDP案例_在线咨询
    MFC对话框水平和垂直滚动条功能
    对话框中滚动条
    ON_COMMAND_RANGE 多个按钮响应一个函数
    char**赋值
    MFC如何使dialog对话框置顶
    如何让CListBox控件滚动条自动向下滚动?
    不带,以及带参数,带返回值的Lambda表达式
    JAVA学习_多线程技术
    最烦有些技术帖上来就放代码
  • 原文地址:https://www.cnblogs.com/colinliu/p/4817723.html
Copyright © 2011-2022 走看看