HTML的内联框架(iframe)

HTML的内联框架(iframe)

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

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

语法:

<!--
src:地址
frameborder:0为无边框;1为有边框
-->
<iframe src="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="https://www.baidu.com/" frameborder="0" width="800" height="600"></iframe>
<hr/>
<h1>上面是网页内部打开网页</h1>
</body>
</html>

第二种:打开网页没内联框架的页面,需要点击页面中的跳转链接

 

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

语法:

<a href="https://www.baidu.com/" target="hello" >点击跳转</a>
<hr/>
<iframe src="" name="hello" 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/>
<a href="https://www.baidu.com/" target="hello" >点击跳转</a>
<hr/>
<iframe src="" name="hello" frameborder="0" width="800" height="600"></iframe>
<hr/>
<h1>上面是网页内部打开网页</h1>
</body>
</html>

扫描二维码关注公众号,回复: 9197490 查看本文章

猜你喜欢

转载自www.cnblogs.com/WZ-BeiHang/p/12317115.html