将不同的html页面组合成一个——通过框架标签frameset和frame实现

xiaoxiao2021-02-28  42

html静态网页实现一个菜单功能,左边点不同链接,右边加载不同页面。

要实现这一个功能,我们可以使用frameset标签,它与body标签属于同一级,所以我们要在主html页面编码中删除body标签。

我们使用src指定frame子项加载的网页的地址,使用name熟悉+target熟悉将页面显示在指定位置,如右边的块。

实现效果:

代码如下

主html文件:

<html> <head> <meta charset=UTF-8"> <title>Frameset Test</title> </head> <frameset rows="120,*"> <frame src="top.html" > <frameset cols="120,*"> <frame src="left.html"> <frame name="right" src="right.html"> </frameset> </frameset> </html>

top.html:

<html> <head> <meta charset=UTF-8"> <title>top</title> </head> <body> top </body> </html>

right.html:

<html> <head> <meta charset=UTF-8"> <title>right</title> </head> <body> This is right. </body> </html>

left.html:

<html> <head> <meta charset=UTF-8"> <title>left</title> </head> <body> <a href="menu1.html" target="right">menu1</a> <a href="menu2.html" target="right">menu2</a> <a href="menu3.html" target="right">menu3</a> </body> </html>

menu1.html:

<html> <head> <meta charset=UTF-8"> <title>menu1</title> </head> <body> This is menu1. </body> </html>menu2和menu3类似menu1!
转载请注明原文地址: https://www.6miu.com/read-2623920.html

最新回复(0)