html里frame导航框架实现方法

html里frame导航框架实现方法  

看了w3cschool里面html框架一节,里面有讲到导航框架,而且有一个可以diy的实例,但是这个例子里省掉了关键性的内容,让人看得不明不白,,经过我的整理,现在还原htmlframe导航框架的设置方法。

过程很简单的,,只需简单的几步就可以实现这个美妙的功能了。

 

这个框架导航还是非常有用的,大凡有点名气的网站,大都或多或少用到了这个功能。

我以最精简的实例讲解。这个例子模仿w3cschool关于html导航框架的例子。

首先,用dreamweaver在电脑桌面新建一个站点,站点根文件夹里建5个网页,分别取名1.html2.html3.html4.html5.html

其次,分别在这5个网页里面写入代码,在1.html2.html3.html3个网页里分别设置一种背景颜色就行了,因为只是简单的测试,

比如红色,蓝色,橙色。

5.html里写入

<html>

<framesetcols="30%,70%">
<frame src="4.html" />
<framesrc="5.html" name="show"/>

</html>

 

4.html里写入

<html>

<p>  <ahref="1.html" target="show">A</a>     </p>
<p>  <a href="2.html" 
target="show">B</a>    </p>
<p>  <a href="3.html" 
target="show">C</a>     </p>

</html>

大功告成了,用浏览器打开5.html,会有如下这个红色的页面,


点击B的时候会有这个页面,


点击C的时候会有这个页面,


预期的效果实现了,左边的A,B,C就是导航菜单,后边的就是变化的网页内容。

红色部分是关键内容,请细心琢磨。我觉得这是指定哪个网页在哪个窗口打开,这也是frame框架的关键所在。

<frame src="5.html"name="show"/>  这句里的name="show",是指定这个frame的名称为show,

<a href="1.html"target="show">A</a>,这句起到的作用是指定1.html这个网页在名称为showflame里打开。

 

  • 4
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值