当前位置:首页 > Web开发 > 正文

HTML的内联框架(iframe)

2024-03-31 Web开发

标签:

HTML的内联框架(iframe) 第一种:打开网页就是带内联框架的页面

可以实现在自己的网页内部,打开另一个网页

语法:

<!--
src:地址
frameborder:0为无边框;1为有边框
-->
<iframe src="http://www.mamicode.com/https:/www.baidu.com/" frameborder="0" width="800" height="600"></iframe>

技术图片

完整代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>iframe内联框架学习</title>
</head>
<body>
<h1>下面是网页内部打开网页</h1>
<hr/>
<!--
src:地址
frameborder:0为无边框;1为有边框
-->
<iframe src="http://www.mamicode.com/https:/www.baidu.com/" frameborder="0" width="800" height="600"></iframe>
<hr/>
<h1>上面是网页内部打开网页</h1>
</body>
</html>
第二种:打开网页没内联框架的页面,需要点击页面中的跳转链接

与之前的点击跳转到指定网站的区别在于,,现在是在网页内部打开网站,而不是新标签页打开。

语法:

<a href="http://www.mamicode.com/https:/www.baidu.com/" target="hello" >点击跳转</a>
<hr/>
<iframe src="" frameborder="0"></iframe>

技术图片

完整代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>iframe内联框架学习</title>
</head>
<body>
<h1>下面是网页内部打开网页</h1>
<hr/>
<a href="http://www.mamicode.com/https:/www.baidu.com/" target="hello" >点击跳转</a>
<hr/>
<iframe src="" frameborder="0"></iframe>
<hr/>
<h1>上面是网页内部打开网页</h1>
</body>
</html>

HTML的内联框架(iframe)

温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/30092.html