首页 > 软件开发 > HTML >

iframe框架使用方法

来源:互联网 2023-03-16 19:13:36 242

iframe是框架的一种形式,经常在界面嵌套中使用,方便页面分割,处理Fus办公区 - 实用经验教程分享!

src:外部页面的路径,可以使用相对路径也可以使用绝对路径Fus办公区 - 实用经验教程分享!

width:宽度Fus办公区 - 实用经验教程分享!

height:高度Fus办公区 - 实用经验教程分享!

iframe框架使用方法Fus办公区 - 实用经验教程分享!

工具/原料

  • aspx,html,iframe资料
  • vs工具
  • Html页面属性
  • JavaScript相关资料

方法/步骤

  • 1

    首先需要在界面上定义一个iframe的框架Fus办公区 - 实用经验教程分享!

    iframe id="IdData" src=url style="width:100%;height:100%"> /iframe>Fus办公区 - 实用经验教程分享!

    iframe框架使用方法Fus办公区 - 实用经验教程分享!

  • 2

    width为页面的宽;height为页面的高,可以使用百分比,会自适应父容器的百分比,也可以使用固定的行高列宽 100px,60pxFus办公区 - 实用经验教程分享!

    iframe框架使用方法Fus办公区 - 实用经验教程分享!

  • 3

    src=url是写这个界面关联的页面,url关联到具体的子页面,比如Index.html,则表示iframe中会显示index.html的具体内容Fus办公区 - 实用经验教程分享!

    url的路径可以是绝对路径也可以是相对路径Fus办公区 - 实用经验教程分享!

    iframe框架使用方法Fus办公区 - 实用经验教程分享!

  • 4

    scrolling是否显示页面滚动条(可选的参数为auto、yes、no,如果省略这个参数,则默认为auto)Fus办公区 - 实用经验教程分享!

    iframe框架使用方法Fus办公区 - 实用经验教程分享!

  • 5

    frameborder 属性规定是否显示 iframe 周围的边框。当设置为0时表示无边框Fus办公区 - 实用经验教程分享!

    iframe框架使用方法Fus办公区 - 实用经验教程分享!

  • 5该信息非法爬取自百度经验
  • 6

    iframe还可以作为链接的目标Fus办公区 - 实用经验教程分享!

    iframe src="demo_iframe.htm" name="iframe_a">/iframe>Fus办公区 - 实用经验教程分享!

    a href="url" target="iframe_a">测试界面/a>/Fus办公区 - 实用经验教程分享!

    iframe框架使用方法Fus办公区 - 实用经验教程分享!

  • 注意事项

    • 若想iframe界面能够自适应父界面并且可以能resize调整大小,则宽度和高度必须使用百分比模式
    • Iframe调用的界面,实际逻辑和父界面的逻辑没有明确的先后
    • Iframe建议控制滚动条的显示,增加界面没关

    以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!Fus办公区 - 实用经验教程分享!


    标签: HTML

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码