欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

使用HTML 元素制作导航网页

程序员文章站 2022-07-14 14:48:57
...

1.需要的页面如下:

使用HTML <frameset>元素制作导航网页

2.编写business.html:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<frameset rows="25%,75%">
    <frame src="top.html">
    <frameset cols="25%,75%">
        <frame src="guide.html">
        <frame src="content.html" name="content">
    </frameset>
</frameset>
</html>

3.编写top.html:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
    <h1 align="center" style="line-height: 120px; margin: 0 auto;">HTML开发商业网站</h1>
</body>
</html>

4.编写guide.html:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
    <a href="frame_a.html" target="content">frame_a</a>
    </br>
    <a href="frame_b.html" target="content">frame_b</a>
    </br>
    <a href="frame_c.html" target="content">frame_c</a>
</body>

</html>

5.编写content.html,frame_a.html,frame_b.html,frame_c.html,这几个页面,其中content.html是个空页面,其它三个页面代码类似如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
    <h2 align="center"
        style="line-height: 400px; margin: 0 auto; background-color: red;">这是frame_a页面</h2>
</body>
</html>

最后将这几个页面放在同一文件夹和目录下,打开business.html就可以看到效果,如下所示:
使用HTML <frameset>元素制作导航网页