使用框架,可以在同一个浏览器窗口中显示不至一个页面。
iframe语法
<iframe src="URL"></iframe>
Iframe--设置高度与宽度
height和width属性用来定义iframe标签的高度和宽度
默认以像素为单位,但是乜可以指定其按比例显示(如:"80%")
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>自选教程(如约智惠.com)</title>
</head>
<body >
<iframe src="http://www.baidu.com" width="200" height="200"></iframe>
<p>一些旧的浏览器不支持 iframe。</p>
<p>如果浏览器不支持 iframes 则不会显示。</p>
</body>
</html>
Iframe--移除边框
frameborder 属性用于定义iframe表示是否显示边框。设置属性值为 "0" 移除iframe的边框:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>自选教程(如约智惠.com)</title>
</head>
<body >
<iframe src="http://www.baidu.com" width="200" height="200" frameborder="0" ></iframe>
<p>一些旧的浏览器不支持 iframe。</p>
<p>如果浏览器不支持 iframes 则不会显示。</p>
</body>
</html>
使用iframe来显示目标链接页面
iframe可以显示一个目标链接的页面。目标链接的属性必须使用iframe的属性,如下实例:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>自选教程(如约智惠.com)</title>
</head>
<body >
<iframe src="http://www.baidu.com" name="iframe_a" ></iframe>
<p>
<a href="https://www.jd.com" target="iframe_a">京东</a>
</p>
<p>
<b>注意:</b> 因为 a 标签的 target 属性是名为 iframe_a 的 iframe 框架,所以在点击链接时页面会显示在 iframe框架中。
</p>
</body>
</html>
HTML iframe 标签
参考:
https://www.yuque.com/docs/share/6e97e120-d640-4a74-a8e4-8f932caa4d35