html内嵌其他网页iframe

最新推荐文章于 2025-04-25 19:58:16 发布

小李大魔王

最新推荐文章于 2025-04-25 19:58:16 发布

阅读量903

点赞数 5

文章标签： html 前端

本文链接：https://blog.youkuaiyun.com/weixin_74261199/article/details/142772051

版权

在很多情况下，需要将其他网页内嵌到自己的网页，如：

只需要使用iframe标签即可，通过src属性指定网站地址即可，代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>利用iframe内嵌B站</title>
</head>
<body>
    <div class="title">内嵌B站</div>
    <div class="box">
        <iframe src="https://www.bilibili.com/" frameborder="0"></iframe>
    </div>
</body>
<style>
    .box {
        width: 80vw;
        height: 70vh;
        margin: 2vh auto;
    }
    .box iframe {
        width: 100%;
        height: 100%;
    }
    .title {
        width: fit-content;
        margin: 5vh auto;
        font-size: 36px;
        color: red;
        letter-spacing: 0.3em;
        
    }
</style>
</html>

更多使用见：菜鸟教程 iframe(runoob.com)

关注博主即可阅读全文