iframe框架

最新推荐文章于 2024-11-09 21:10:10 发布

cdgogo

最新推荐文章于 2024-11-09 21:10:10 发布

阅读量156

点赞数

分类专栏： html 文章标签： html

本文链接：https://blog.youkuaiyun.com/cdgogo/article/details/120381286

版权

html 专栏收录该内容

2 篇文章

订阅专栏

本文详细探讨了HTML的iframe框架，包括其用法、优势、限制以及如何在网页中嵌入iframe。通过实例展示了如何加载外部网页、设置iframe的大小和属性，并讨论了iframe在跨域通信中的角色和安全考量。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

效果图：
在这里插入图片描述


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .left{
            width: 20%;
            float: left;
        }
        .left a{
            display: block;
            text-align: center;
            margin-bottom: 10px;
            text-decoration: none;
            font-size: 18px;
        }
        .right{
            width: 80%;
            float: left;
        }
    </style>
</head>

<body>
    <div class="wrap">
        <div class="left">
            <a href="index.htm" target="rightframe">首页</a>
            <a href="page.htm" target="rightframe">次页</a>
            <a href="menu.htm" target="rightframe">目录</a>
            <a href="personal.html" target="rightframe">个人简介</a>
        </div>
        <div class="right">
            <iframe src="index.htm" frameborder="0" name="rightframe" width="100%" height="800px"></iframe>
        </div>
    </div>
</body>

</html>