一直想要实现一个类似windows桌面程序的书签页的界面，今天在网上搜索网页图片素材时，无意中看到了一个类似的程序，先收录下来，以便以后借鉴和在此基础上采用div+css的设计思想进行改写。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>网页特效代码|JsCode.CN|---经典实用的触发型导航菜单</title>
</head>
<body>
<STYLE type=text/css>.sec1 {
BORDER-RIGHT: gray 1px solid; BORDER-TOP:
#ffffff 1px solid; BORDER-LEFT: #ffffff 1px
solid; CURSOR: hand; COLOR: #000000; BORDER-
BOTTOM: #ffffff 1px solid; BACKGROUND-COLOR:
#eeeeee
}
.sec2 {
BORDER-RIGHT: gray 1px solid; BORDER-TOP:
#ffffff 1px solid; FONT-WEIGHT: bold; BORDER-
LEFT: #ffffff 1px solid; CURSOR: hand; COLOR:
#000000; BACKGROUND-COLOR: #d4d0c8
}
.main_tab {
BORDER-RIGHT: gray 1px solid; BORDER-
LEFT: #ffffff 1px solid; COLOR: #000000; BORDER-
BOTTOM: gray 1px solid; BACKGROUND-COLOR: #d4d0c8
}
</STYLE>
<!--JavaScript部分-->
<SCRIPT language=javascript>
function secBoard(n)
{
for(i=0;i<secTable.cells.length;i++)
secTable.cells
[i].className="sec1";
secTable.cells[n].className="sec2";
for(i=0;i<mainTable.tBodies.length;i++)
mainTable.tBodies
[i].style.display="none";
mainTable.tBodies
[n].style.display="block";
}
</SCRIPT>
<!--HTML部分-->
<TABLE id=secTable cellSpacing=0 cellPadding=0 width=549 border=0>
<TBODY>
<TR align=middle height=20>
<TD class=sec2 onclick=secBoard(0) width="10%">关于TBODY标记</TD>
<TD class=sec1 onclick=secBoard(1) width="10%">关于cells集合</TD>
<TD class=sec1 onclick=secBoard(2) width="10%">关于tBodies集合</TD>
<TD class=sec1 onclick=secBoard(3) width="10%">关于display属性</TD></TR></TBODY></TABLE>
<TABLE class=main_tab id=mainTable height=240 cellSpacing=0 cellPadding=0 width=549 border=0><!--关于TBODY标记-->
<TBODY style="DISPLAY: block">
<TR>
<TD vAlign=top align=middle><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>指定行做为表体。
<BR>注释：TBODY要素是块要素，并且需要结束标
签。<BR> 即使如果表格没有显式定义TBODY
要素，该要素也提供给所有表。<BR><BR>
参考：《动态HTML参考和开发应用大全》（人民邮电出
版社
Microsoft Corporation著
北京华中兴业科技发展有限公司
译）
<BR><BR></TD></TR></TB
ODY></TABLE></TD></TR></T
BODY><!--关于cells集合-->
<TBODY style="DISPLAY:
none">
<TR>
<TD vAlign=top
align=middle><BR><BR>
<TABLE cellSpacing=0
cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>检索表行或者整个
表中所有单元格的集合。<BR>应用于TR、TABLE。
<BR><BR>参考：《动态HTML参考和开发应
用大全》（人民邮电出版社
Microsoft Corporation著
北京华中兴业科技发展有限公司
译）
<BR><BR></TD></TR></TB
ODY></TABLE></TD></TR></T
BODY><!--关于tBodies集合-->
<TBODY style="DISPLAY:
none">
<TR>
<TD vAlign=top
align=middle><BR><BR>
<TABLE cellSpacing=0
cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>检索表中所有TBODY
对象的集合。对象在该集合中按照HTML源顺序排列。
<BR>应用于TABLE。<BR><BR>参考：
《动态HTML参考和开发应用大全》（人民邮电出版社
Microsoft Corporation著
北京华中兴业科技发展有限公司
译）
<BR><BR></TD></TR></TB
ODY></TABLE></TD></TR></T
BODY><!--关于display属性-->
<TBODY style="DISPLAY:
none">
<TR>
<TD vAlign=top
align=middle><BR><BR>
<TABLE cellSpacing=0
cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>设置或者检索对象
是否被提供。<BR>可能的值为block、none、
inline、list-item、table-header-group、table-
footer-group。<BR>该特性可读写，块要素默认
值为block，内联要素默认值为inline；层叠样式表
（CSS）属性不可继承。<BR><BR>参考：《
动态HTML参考和开发应用大全》（人民邮电出版社
Microsoft Corporation著
北京华中兴业科技发展有限公司译）
<BR><BR><A
href="http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/display.asp?frame=true"
target=_blank>点击此处
</A>可参阅微软<A href="http://msdn.microsoft.com/" target=_blank>MSDN在线</A>上的解释。
</TD></TR></TBODY></TABLE>
;</TD></TR></TBODY></TABLE&g
t;</body>
</html>
分享到：
相关推荐
•书签库，这是一种功能强大的单一窗口界面，类似苹果公司流行的iTunes™和iPhoto™应用。它可以使书签的编排和管理工作变得极为简单便捷； •弹出屏蔽功能可以自动阻塞插入的广告； •地址簿集成，该功能可以...
升级加密狗驱动程序，增加了对 Windows 7, Vista 等操作系统的支持。 5. 操作系统界面功能支持库(shell.fne)中的“执行()”命令增加一个参数“窗口显示方式”，作用与核心库“运行()”命令的同名参数一致。 6. ...
Chrome包含了“无痕浏览”（Incognito）模式（与Safari的“私密浏览”和Internet Explorer 8的“InPrivate”类似），这个模式可以“让你在完全隐密的情况下浏览网页，因为你的任何活动都不会被记录下来”，同时也...
并让这些限制变成一座监狱”，例如在其中一个标签页运作的恶意软件，将无法窃取信用卡号码、干扰鼠标运作，或告诉系统在启动时运行某个程序，并且恶意软件会在标签页关闭时立即中止。 插件（Plugins）：插件通常并...
多媒体网络教室经过严格的软、硬件测试过程，全面支持 Windows 系列操作系统，包括 Windows 9X、Windows Me、Windows NT 4.0、Windows 2000、Windows XP以及 Windows RPL/PXE 无盘工作站，支持跨网段校园网教学，对...
文件夹Bookmarks-This特性类似于浏览器的收藏夹或书签功能。你可以收藏每网站一个或多个文件夹路径,后来回到这些路径选择书签。 文件和文件夹Links-Navigate文件夹与缓解一种上传软件的帮助下的各种链接配置选项。...