iframe实例

最新推荐文章于 2022-10-25 15:07:35 发布

weixin_34192993

最新推荐文章于 2022-10-25 15:07:35 发布

阅读量653

点赞数 1

文章标签： python

原文链接：https://my.oschina.net/shuaihong/blog/1610007

版权

2019独角兽企业重金招聘Python工程师标准>>>

引言：平时开发工作中，我们常需要将其他的网站的内容，添加到自己的网站中，例如本例在线客服，我们就需要应用到iframe框架。

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>
<body>
	<div id="onlineconsult" class="page-container">
        <header class="header">在线咨询</header>
        <div class="iframeContainer">
            <iframe width="100%" height="100%" style="border:0;" src="http://www.baidu.com" frameborder="0">
            </iframe>
        </div>
    </div>
</body>
</html>
<style>
body {
	margin:0;
	padding:0;
}
.header {
	height: 46px;
	text-align: center;
	line-height: 46px;
}
.iframeContainer{
	width: 100%; 
	position: absolute; 
	left: 0; 
	top: 46px; 
	bottom: 0; 
	right: 0;
}
</style>

结果：输入图片说明