`

用div+iframe 代替frameset 框架

框架XHTMLHTMLCC++ 
阅读更多
frameset 已经过时, 使用frameset会带来很多问题,比如session丢失等. 所以提倡用iframe,iframe的好处我就不用多说了.下面用div+iframe来代替frameset的收缩与展开功能.
view plaincopy to clipboardprint?

   1. <%@ Page Language="C#" AutoEventWireup="true" Codebehind="Default.aspx.cs" Inherits="ProductServices10._Default" %> 
   2.  
   3.  
   4.  
   5. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
   6.  
   7. <html xmlns="http://www.w3.org/1999/xhtml"> 
   8.  
   9. <head id="Head1" runat="server"> 
  10.  
  11.     <title>产品服务系统</title> 
  12.  
  13.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  14.  
  15.     <style type="text/css"> 
  16.  
  17.         html,body{ 
  18.  
  19.      margin:0px; 
  20.  
  21.      height:100%; 
  22.  
  23.     } 
  24.  
  25.     </style> 
  26.  
  27.     <script language="javascript" type="text/javascript"> 
  28.  
  29.         function DisplayNav() 
  30.  
  31.         { 
  32.  
  33.             var nav = document.getElementById('divLeft'); 
  34.  
  35.             var main = document.getElementById('divmain'); 
  36.  
  37.             if(nav.style.display=='block'|| nav.style.display=='') 
  38.  
  39.             { 
  40.  
  41.                 nav.style.display='none'; 
  42.  
  43.                  
  44.  
  45.                 main.style.display = 'block'; 
  46.  
  47.             } 
  48.  
  49.             else 
  50.  
  51.             { 
  52.  
  53.                 nav.style.display='block'; 
  54.  
  55.                 main.style.marginleft='395px'; 
  56.  
  57.             } 
  58.  
  59.         } 
  60.  
  61.     </script> 
  62.  
  63. </head> 
  64.  
  65. <body style="margin: 0; padding: 0; background-color: #0266C6;"> 
  66.  
  67.     <form id="from1" runat="server"> 
  68.  
  69.         <div id="divTop" style="width: 100%; height: 60px; border: none 0px"> 
  70.  
  71.             <img src="Images/Top/toplogo.jpg" onclick="DisplayNav();" /> 
  72.  
  73.         </div> 
  74.  
  75.         <div style="width:100%;height: 100%; border: none 0px"> 
  76.  
  77.             <div id="divLeft" style="width: 195px; height:100%; overflow: hidden; float: left;"> 
  78.  
  79.                 <iframe src="left.aspx" style="height: 100%" frameborder="0" border="0" marginwidth="0" marginheight="0" ></iframe> 
  80.  
  81.             </div> 
  82.  
  83.             <div id="divmain" style="height: 100%; border: none 0px"> 
  84.  
  85.                      <iframe src="main.aspx" width="100%" height="100%" frameborder="0" border="0" marginwidth="0" marginheight="0" ></iframe> 
  86.  
  87.             </div> 
  88.  
  89.         </div> 
  90.  
  91.     </form> 
  92.  
  93. </body> 
  94.  
  95. <html> 
分享到：
| DWR运行原理
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    以div代替frameset，用css实现仿框架布局

    如果需要实现类似`frameset`的交互效果，可以结合`div`和`iframe`一起使用。 总的来说，通过熟练运用`div`和CSS，我们可以创建出与`frameset`类似甚至更灵活的布局，同时避免了`frameset`带来的问题。这要求开发者...

    深入剖析HTML5 内联框架iFrame

    由于现在frame和frameset很少使用，已经过时了，已经被div+CSS代替了，所以，这里只是举例说明一下，当下还在使用的内联框架iFrame 所谓的iFrame内联框架，我的理解就是在网页内部嵌套一个网页，并且可以一级一级地...

    HTML框架代码全集.pdf

    HTML框架代码全集包含了多种用于网页布局和内容展示的HTML标签与...随着HTML5、CSS3和JavaScript等现代网页技术的发展，现在我们有了更加强大和灵活的方式来构建网页，如使用div标签和CSS定位技术来代替旧的框架技术。

    ThinkPHP后台首页index使用frameset时的注意事项分析

    最后，任何使用ThinkPHP框架进行Web开发的开发者，都应该确保在进行frameset布局的时候，路径引用要准确，注意SEO问题，并且在可能的情况下考虑使用更加现代的布局技术来代替frameset。同时，始终重视代码的调试和...

    div ,frame等空间的透明实现代码

    在HTML5中，推荐使用`&lt;iframe&gt;`标签代替`&lt;frame&gt;`和`&lt;frameset&gt;`标签。不过，若需要针对旧版浏览器做兼容性处理，`allowTransparency`属性仍然是一个可行的解决方案。 另外，在CSS3中，我们有了更多控制元素透明度...

    html标签注释集合[借鉴].pdf

    3. `&lt;acronym&gt;`: 标记缩写词，但HTML5中不再推荐使用，可以用`&lt;abbr&gt;`代替。 4. `&lt;address&gt;`: 用于表示作者或联系信息，通常用于页脚。 5. `&lt;applet&gt;`: 在HTML4中用于嵌入Java小应用程序，但在HTML5中已被废弃。 ...

    html标签定义 HPH

    6. `&lt;applet&gt;`：不推荐使用的标签，用来嵌入Java小应用程序，现在通常使用`&lt;object&gt;`或`&lt;embed&gt;`标签代替。 7. `&lt;area&gt;`：在`&lt;map&gt;`图像映射中定义点击区域。 8. `&lt;b&gt;`：定义加粗文本。 9. `&lt;base&gt;`：设置页面中...

    完整的_HTML_参考手册

    25. `&lt;dir&gt;`: 不推荐使用，用于创建目录列表，现可以用`&lt;ul&gt;`替换。 26. `&lt;div&gt;`: 作为布局工具，用于创建文档的分区或容器。 27. `&lt;dfn&gt;`: 用于定义定义项，常用于术语或新词汇的首次出现。 28. `&lt;dl&gt;`: 用于...

    HTML标签整理.docx

    2. `&lt;acronym&gt;`：表示首字母缩写词，已不再推荐使用，现在通常使用`&lt;abbr&gt;`代替。 3. `&lt;address&gt;`：用于展示作者或文档的联系信息，通常用于页脚。 4. `&lt;applet&gt;`：用于在页面上嵌入Java小应用程序，但现代HTML5中...

    HTML标签合集HTML标签合集

    14. `&lt;marquee&gt;`：创建滚动文字或图像，已非标准，建议使用CSS动画代替。 15. `&lt;pre&gt;`：预格式化文本，保留原始的空格和换行。 16. `&lt;hr&gt;`：绘制水平线，分隔内容。 17. ` `：插入一个简单的换行。 18. `&lt;ul&gt;` 和...

    HTML 标记一览.doc

    - `&lt;strike&gt;`：添加删除线，已弃用，用`&lt;del&gt;`或CSS代替。 - `&lt;code&gt;`：展示代码样式的文本。 - `&lt;kbd&gt;`：模拟键盘输入的文本样式。 - `&lt;samp&gt;`：展示示例代码的文本样式。 - `&lt;var&gt;`：表示变量的斜体效果。 -...

    HTML颜色参考手册（网页开发必备工具）

    - `&lt;menu&gt;`创建菜单列表，现在通常用`&lt;ul&gt;`代替。 - `&lt;meta&gt;`提供文档元数据，如字符集、刷新间隔等。 - `&lt;nobr&gt;`阻止文本换行。 - `&lt;noframes&gt;`为不支持框架的浏览器提供内容。 - `&lt;noscript&gt;`为不支持脚本的浏览器...

    HTML语言剖析之HTML标记一览

    - `&lt;ISINDEX&gt;`：旧式表单搜索输入，现在通常用`&lt;FORM&gt;`和`&lt;INPUT&gt;`代替。 11. **多媒体标记**： - `&lt;BGSOUND&gt;`：在页面背景播放音频，仅限于Internet Explorer。 - `&lt;EMBED&gt;`：插入多媒体，如音频、视频或插件。...

    HTML元素参考手册

    41. `&lt;iframe&gt;`：创建内联框架，可以嵌入其他网页或资源。 42. `&lt;img&gt;`：插入图像，`src`属性定义图像的URL。 43. 各种`&lt;input&gt;`类型：创建不同类型的表单输入，如文本框、按钮、复选框、单选按钮、文件上传等。 ...

    入门级HTML教程-HTML元素

    `&lt;dir&gt;`创建目录列表，现在通常使用`&lt;ul&gt;`代替。`&lt;div&gt;`是通用容器元素，用于组合其他HTML元素。`&lt;dl&gt;`定义了定义列表。`&lt;dt&gt;`是定义列表中的术语。 `&lt;em&gt;`用于强调文本，通常以斜体显示。`&lt;embed&gt;`插入外部资源，...

    HTML标记大全.doc

    `&lt;DIV&gt;`** - **类型**：定位标记 - **名称或意义**：定义分区或节。 - **作用**：用于组合其他HTML元素，便于使用CSS进行布局和样式化。 - **备注**：是最常用的容器标签之一。 **7. `&lt;NOBR&gt;`** - **类型**：不...

    HTML标签总结

    - **替代方案**：使用`&lt;abbr&gt;`标签来代替。 #### &lt;address&gt;: 地址标签 - **功能**：用于定义联系信息，如作者/拥有者的地址。 - **用法**：通常放在文档的头部或尾部。 #### &lt;area&gt;: 图像映射区域标签 - **功能**...

Magicbox
Global site tag (gtag.js) - Google Analytics