HTML网页制作:[14]创建框架链接

 时间:2024-10-16 01:18:12

这篇经验是和我的HTML网页制作系列的前两篇经验挂钩的。好吧,如果你还不知道什么是框架,请看我的第12,13篇《HTML网页制作》经验。

工具/原料

一台电脑

txt或DW等

一.frameset的连接方法

1、首先看下小编的目录架构1.html将作为主页面2.html将作为目录页面,里面有2个目录,分别是目录一和目录二3.html为目录一将要链接的页面4.html为目录二将要链接的页面

HTML网页制作:[14]创建框架链接

2、然后,看下1.html的代码<framesetcols="3廴类锾渭0%,70%&quo墉掠载牿t;frameborder="yes"framespacing="1"><framesrc="2.html"name="left"><framesrc="3.html"name="right">其中,name的意思是,指定frame的名字,他有什么用呢,看后面

HTML网页制作:[14]创建框架链接

3、再看2.html的代码<ul><li><ahref=&quo隋茚粟胫t;3.html"target=&鳎溻趄酃quot;right">目录一</a></li><li><ahref="4.html"target="right">目录二</a></li></ul>我创建了一个列表,然后目录一链接3.html,目录二链接4.html。注意,有一个target的属性,他的值就是上面frame的名字。意思是,点击目录一,将链接到3.html,然后将3.html显示在frame的名字为right的框架中

HTML网页制作:[14]创建框架链接

4、再来看下3.html的代码。没什么可说的,显示几个字而已

HTML网页制作:[14]创建框架链接

5、再来看4.html的代码,也没什么可说的

HTML网页制作:[14]创建框架链接

6、OK,来看1.html的网页效果点击目录一,右侧将显示3.html的内容

HTML网页制作:[14]创建框架链接

7、点击目录二,右侧将显示4.html的内容

HTML网页制作:[14]创建框架链接

二.iframe的连接方法

1、这个和上面基本相同。瘫蝠熨夯我也不想多说什么了。<iframename="heihei&q锇栀劐箨uot;src="3.html"></iframe>语法就是这样!在另外一个地方,用target链接这个名字,就可以了!

2、OK,就是那么简单,当然,网页做的很粗糙,代码也未必符合规范,但是起到一个抱砖引玉的作用,先入门,然后再优化!

Dreamweaver学习:[33]怎么利用层来制作网页 Dreamweaver如何设置辅助功能 如何利用html制作网页水平导航菜单? Dreamweaver CS6中“重复区域”循环不显示 DW中怎么利用DIV+CSS做径向圆形渐变?
热门搜索
卡通小狗图片 真人女性生图片高清黑毛 word图片排版 大众朗境报价及图片 暴走漫画官网