HTML:frame导航框架的实现方法
发布日期:2021-06-30 15:41:53 浏览次数:2 分类:技术文章

本文共 544 字,大约阅读时间需要 1 分钟。

在看w3school里面HTML课程的时候,看到框架,有一个导航框架的实例。实现了功能,但是没有给出源码。我查了一下frame的具体操作方法,写出了所有代码。

我写的导航框架包括五个文件

在这里插入图片描述
其中,每个文件的代码依次为。
框架_导航框架.html

 

在这部分代码中,使用cols属性将页面分为两部分,一部分包括120像素,另一部分为剩余部分。同时指定两部分分别的HTML代码。第二个frame中name属性,相当于给该frame起了一个名字,方面后面对该部分进行操作。

框架_导航框架_目录链接.html

Frame a

Frame b

Frame c

在框架_导航框架.html中,相当于用frameset将整个页面分成了两部分,此部分代码相当于对左边部分进行操作。增加三个超链接。target属性,用于指定对应的html文件在名称name为showfram的frame中打开。

框架_导航框架_显示a.html

Frame B

框架_导航框架_显示b.html

Frame B

框架_导航框架_显示c.html

Frame a

这三部分代码仅书写三个不同的结果界面。

最终实现效果图如下。

初始界面以及点击Frame a界面:

在这里插入图片描述
点击Frame b界面:
在这里插入图片描述
点击Frame c界面:
在这里插入图片描述

转载地址:https://kaisarh.blog.csdn.net/article/details/102613800 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:Git:checkout命令无法切换回master
下一篇:实战Python:利用python在pycharm开发名片管理系统

发表评论

最新留言

不错!
[***.144.177.141]2024年04月23日 21时56分07秒