简单实现框架菜单

最新推荐文章于 2025-05-29 09:26:32 发布

原创最新推荐文章于 2025-05-29 09:26:32 发布 · 982 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#框架 #border #嵌入式 #html #浏览器 #iframe

JavaScript技巧专栏收录该内容

3 篇文章

订阅专栏

本文介绍了企业信息管理系统中使用的框架、组件及其布局结构，包括顶部导航、主体内容区域及底部信息区，以及如何实现页面间的信息传递和交互。

main.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="98,*,8" frameborder="no" border="0" framespacing="0"> <frame src="top.html" mce_src="top.html" name="topFrame" scrolling="No" noresize="noresize" id="topFrame" /> <frame src="center.html" mce_src="center.html" name="mainFrame" id="mainFrame" /> <frame src="down.html" mce_src="down.html" name="bottomFrame" scrolling="No" noresize="noresize" id="bottomFrame" /> </frameset> <noframes><body> </body> </noframes> </html>

left.html

<mce:script type="text/javascript"></mce:script> <ul> <li><a href="#" mce_href="#" class="STYLE3" onClick="show()">短信群发</a></li> </ul>

middle.html

<body style="overflow:hidden" mce_style="overflow:hidden"> <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0" style="table-layout:fixed;" mce_style="table-layout:fixed;"> <tr> <td width="171" id=frmTitle noWrap name="fmTitle" align="center" valign="top"><table width="171" height="100%" border="0" cellpadding="0" cellspacing="0" style="table-layout:fixed;" mce_style="table-layout:fixed;"> <tr> <td bgcolor="#1873aa" style="width:6px;"> </td> <td width="165"><iframe name="I1" height="100%" width="165" src="left.html" mce_src="left.html" border="0" frameborder="0" scrolling="no"> 浏览器不支持嵌入式框架，或被配置为不显示嵌入式框架。</iframe></td> </tr> </table> </td> <td width="6" style="width:6px;"valign="middle" bgcolor="1873aa" onclick=switchSysBar()><SPAN class=navPoint id=switchPoint title=关闭/打开左栏><img src="images/main_55.gif" mce_src="images/main_55.gif" name="img1" width=6 height=40 id=img1></SPAN></td> <td width="100%" align="center" valign="top"><iframe id="I2" name="I2" height="100%" width="100%" border="0" frameborder="0" src="tab/tab.html" mce_src="tab/tab.html"> 浏览器不支持嵌入式框架，或被配置为不显示嵌入式框架。</iframe></td> </tr> </table> </body>

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> </head> <body> <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0" style="table-layout:fixed;" mce_style="table-layout:fixed;"> <tr> <td><iframe name="I2" height="100%" width="100%" border="0" frameborder="0" src="middel.html" mce_src="middel.html"> 浏览器不支持嵌入式框架，或被配置为不显示嵌入式框架。</iframe></td> <td width="6" bgcolor="#1873aa" style=" width:6px;" mce_style=" width:6px;"> </td> </tr> </table> </body> </html>

其他down.html、top.html以及要显示在中间内容区的tab.html同普通html网页内容相同。