📄 day4_2.html
字号:
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb_2312-80">
<meta name="GENERATOR" content="Microsoft FrontPage 3.0">
<style type="text/css">
<!--
a:link { color: blue; text-decoration: none}
a:visited { color: purple; text-decoration: none}
a:hover { color: purple; text-decoration: underline}
.unnamed1 { font-family: "宋体"; font-size: 9pt}
#menuBar {position: relative;
left: 0;
top: 0;
width: 100%;
height: 22px;
border: 1px solid #99ffff;
background-color: #99ffff;
layer-background-color: #99ffff;
}
-->
</style>
<style>
<!--#menu {position: absolute;
left: 1px;top: 174px;width: 163px;height: 300px;}
-->
</style>
<style>
<!--#content {position: absolute;
left: 175px;top: 184px;width: 435px;height: 300px;}
-->
</style>
<title>网猴：动态HTML</title>
</head>
<body bgcolor="#FFFFFF">
<div id="content" style="width: 527px; height: 998px; top: 12px; left: 11px">
<table border="0" width="472" cellspacing="0">
<tr>
<td bgcolor="#ffff99" colspan="2"><font size="4" color="#000000"><strong>动态HTML教程
- 第四天</strong></font></td>
</tr>
<tr>
<td bgcolor="#FF6600" colspan="2"><em><font size="4"><a href="mailto:taylor@taylor.org">Taylor</a>
</font><font size="3">1998.3.9</font></em></td>
</tr>
</table>
<p><strong><font face="宋体">第二页：下拉菜单脚本</font></strong></p>
<p><font size="3"><font face="宋体">让我们编写一些我们所熟悉的用户界面元素－－下拉菜单，<br>
子菜单。这些元素和你现在正在浏览的窗口顶部的菜单条很<br>
类似。大多数操作系统都有一个类属专用接口工具集，当你<br>
需要应用下拉菜单时就可调用该工具集。然后你可以设定被<br>
选项目的的名称和执行的行为。 </font></font></p><font size="3">
<p><font face="宋体">由于HTML不包含这样的专用接口工具集，所以你必须建立自<br>
己的工具集。首先你必须描述它的外观。我们在菜单条上加<br>
入一定的颜色以及描述各项功能的名称，例如<tt>file</tt>、<br>
<tt>edit</tt>、<tt>view</tt>等等。当你点击该文字时，就会显示该菜单项下<br>
的子菜单。在子菜单框中点击相应的菜单项目就可触发某个<br>
执行程序的行为。让我们在HTML中编写这样的菜单。</font></p>
<p><font face="宋体">首先，你需要生成一个<tt>DIV</tt>作为顶部的菜单条：</font>
<ul>
<pre><font face="宋体"><div id="menuBar"> </div></font></pre>
</ul>
<p><font face="宋体">现在将该菜单条放在页面顶部，加上特定的颜色：</font>
<ul>
<pre><font face="宋体"><style type="text/css">
#menuBar {position: absolute;
left: 0;
top: 0;
width: 100%;
height: 22px;
border: 1px solid #99ffff;
background-color: #99ffff;
layer-background-color: #99ffff;
}
</style> </font></pre>
</ul>
<p><font face="宋体">则生成这样一个<tt>DIV：</tt></font></p>
</font><div id="menuBar"></div>
<p><font face="宋体" size="3"><br>
你可能会对最后一条CSS规范不知所以然，这项是Netscape <br>
对CSS的扩展，它指的是绝对定位了的元素的背景色。由于<br>
边框设置为<tt>border: 1px solid #99ffff;</tt>，所以有必要加入<br>
这一条使背景色延伸到DIV的边框。否则背景色只能在DIV所<br>
包含的内容底下显示。<a href="day4_3.html">>></a></font></p>
<p><font face="宋体"><strong>动态HTML教程</strong><br>
<font color="#FF0000">第一页</font> <a href="day4_1.html">让我们编写一些有用的东西</a><br>
<font color="#FF0000">第二页</font> 下拉菜单脚本<br>
<font color="#FF0000">第三页</font> <a href="day4_3.html">使菜单初具规模</a><br>
<font color="#FF0000">第四页</font> <a href="day4_4.html">完成菜单条的制作</a><br>
<font color="#FF0000">第五页</font> <a href="day4_5.html">使菜单具备相应的功能</a></font></p>
<p><font size="3">[<a href="day1_1.html">第1天</a>][<a href="day2_1.html">第2天</a>][<a href="day3_1.html">第3天</a>][第4天][<a href="day5_1.html">第5天</a>]</font></p>
<font size="3">
<hr>
</font><font face="verdana, arial, geneva, sans-serif" size="2">本文由<a href="http://chd.126.com" target="_blank">《CHD的网络教室》</a>根据<a href="http://www.webmonkey.com.cn" target="_blank">《网猴》</a>相关文章改编，版权归<a href="http://www.webmonkey.com.cn" target="_blank">《网猴》</a>所有</font><font size="3"><!--webbot bot="Include" endspan i-checksum="63119" -->
</font></div>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -