码迷,mamicode.com
首页 > 其他好文 > 详细

iframe测试

时间:2017-08-12 21:16:53      阅读:306      评论:0      收藏:0      [点我收藏+]

标签:uniq   m3u   tgt   rpd   rck   obb   cdh   kaa   bgp   

iframe类似于frameset,iframe 和 frameset 都用于html页面的框架布局。(都可用于后台管理界面,iframe放于body标签内,frameset不能放在body标签)

1. <iframe> 标签:iframe 是个内联框架,是在页面里生成个内部框架。

2. <frameset> 标签:frameset 定义一个框架集,包含多个子框架,每个框架都有独立的文档。

 

iframe定义和用法

iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。

技术分享

1.   例子

iframe测试.html(包括三个iframe)

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title>iframe测试</title>
    </head>

    <body>

        <iframe src="top.html" width="1360px" name="top" height="200px"></iframe>

        <iframe src="left.html" width="150px" name="left" height="550px"></iframe>

        <iframe src="right.html" width="1160px" height="550px" name="right"></iframe>
    </body>

</html>

 

 

top.html

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>

    <body>
        这是顶部
    </body>

</html>

 

left.html

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>

    <body >
        这是left的内容!!!
        <br />
        <br />
        <br />
        <br />
        <a href="test.html" target="right">点击在右边显示右边</a>

    </body>

</html>

 

right.html

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>

    <body >
        这是right的内容!!!
    </body>

</html>

 

效果:

技术分享

 

 

2.  点击上边左面的html会在右边显示test.html

test.html

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>

    <body>
        这是test页面(将会在name=right的iframe显示)
    </body>

</html>

 效果:技术分享

 

iframe测试

标签:uniq   m3u   tgt   rpd   rck   obb   cdh   kaa   bgp   

原文地址:http://www.cnblogs.com/qlqwjy/p/7351440.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!