在网页设计中,常需要在一个框架中显示文档目录,当单击某目录名时,则会在另一个框架中显示相应的具体内容。这时目录就是热点文本,需要在框架之间建立超链接,并指明显示的目标文件的框架。
通过将<frame>中的name="框架名"与<a>中的target="框架名”相联系,用<a>中的target属性就可以控制目标网页在哪个框架内显示。当单击链接时,目标网页就会出现在指定的框架内。其格式为:
<a href="目标文件名.html"target="框架名">超链接显示文本</a>
说明:“框架名”有4个特殊的值,分别实现4类特殊的操作:
(1)target="_blank":链接的目标文件显示在一个新的未命名的浏览器窗口中。
(2)target="_self":链接的目标文件显示在当前框架窗口中,代替正在显示的热点文本所在的那个文件,此为默认值。
(3)target="_top":链接的目标文件显示在整个浏览器窗口中(取消了框架)。
(4)target="_parent":当框架嵌套时,链接的目标文件显示在父框架中;否则显示在整个浏览器窗口中。
【例6-13】如图6-14所示,建立框架间的链接。
本例需要编写4个HTML文件,分别为框架说明文件、上侧框架文件、右侧框架文件和左侧框架文件。
图6-14 框架间的链接
框架说明文件ex6-13.html的内容为:
<!--文件名:ex6-13.html-->
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>框架间的链接</title>
</head>
<frameset rows="20%,*">
<frame src="ex6-13-top.html"name="top"/><!--上侧窗格-->
<frameset cols="20%,*">
<frame src="ex6-13-left.html"name="left"/><!--左侧窗格-->
<frame src="ex6-13-right.html"name="right"/><!--右侧窗格-->
</frameset>
</frameset>
</html>
上侧框架文件ex6-13-top.html的内容为:
<!--文件名:ex6-13-top.html-->
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html;charset=gb2312">/
<title>TOP框架内容</title>
</head>
<body>
<h3 align="center">《网页制作》课程第4章示例</h3>
<a href="ex4-1.html"target="right">【例4-1】</a>  <!--在右侧窗格中显示-->(www.daowen.com)
<a href="ex4-2.html"target="right">【例4-2】</a>  
<a href="ex4-3.html"target="left">【例4-3】</a>  <!--在左侧窗格中显示-->
<a href="ex4-4.html"target="_blank">【例4-4】</a>  
<a href="ex4-5.html"target="_top">【例4-5】</a>  <!--单击“后退”按钮返回-->
<a href="ex4-6.html"target="top">【例4-6】</a><br/><!--在上侧窗格中显示-->
</body>
</html>
左侧框架文件ex6-13-left.html的内容为:
<!--文件名:ex6-13-left.html-->
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>LFFT框架内容</title>
</head>
<body>
<h3 align="center">第5章示例</h3>
<a href="ex5-1.html"target="right">【例5-1】</a><br/>
<a href="ex5-2.html"target="_self">【例5-2】</a><br/><!--在当前窗格中显示-->
<a href="ex5-3.html"target="_parent">【例5-3】</a><br/>
<a href="ex5-4.html"target="_blank">【例5-4】</a><br/><!--打开新的浏览器窗口-->
<a href="ex5-5.html"target="top">【例5-5】</a><br/><!--在上侧窗格中显示-->
<a href="ex5-6.html"target="left">【例5-6】</a><br/>
</body>
</html>
右侧框架文件ex6-13-right.html的内容为:
<!--文件名:ex6-13-right.html-->
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>RIGHT框架内容</title>
</head>
<body>
<h3 align="center">初始内容</h3>
</body>
</html>
免责声明:以上内容源自网络,版权归原作者所有,如有侵犯您的原创版权请告知,我们将尽快删除相关内容。