HTML框架结构标签<frameset>如何使用?

在布置后台或者其它特殊页面的时候,经常会用到html框架结构标签frameset,那么如何利用frameset框架结构分割页面?

虽说<frameset></frameset>这对HTML框架结构标签在前台页面几乎不用了(影响SEO网站搜索引擎优化),但在后台管理系统布局或其它特殊情况下有它的用武之地!

 

HTML <frameset> 标签可以构造水平框架垂直框架,组合起来还可以构造混合框架

 

水平框架的构造方法

  1. <html> 
  2. <frameset rows="25%,50%,25%"> 
  3.  
  4.   <frame src="/header.html"> 
  5.   <frame src="/center.html"> 
  6.   <frame src="/footer.html"> 
  7.  
  8. </frameset> 
  9. </html> 
frameset横向构造效果图
frameset横向构造效果图

 

 

垂直框架的构造方法

  1. <html> 
  2. <frameset cols="25%,50%,25%"> 
  3.  
  4.   <frame src="/header.html"> 
  5.   <frame src="/center.html"> 
  6.   <frame src="/footer.html"> 
  7.  
  8. </frameset> 
  9. </html> 

 frameset竖向构造效果图

frameset垂直构造效果图

 

混合框架的构造方法

  1. <html> 
  2.  
  3. <frameset rows="50%,50%"> 
  4.  
  5.   <frame src="/header.html"> 
  6.   <frameset cols="25%,75%"> 
  7.     <frame src="/leftMenu.html"> 
  8.     <frame src="/main.html"> 
  9.   </frameset> 
  10.  
  11. </frameset> 
  12.  
  13. </html> 
  14. <!--这个框架构造方法在后台管理系统里较常见--> 

 

frameset混合构造效果图
frameset混合构造效果图

 

注意事项:

 不能将 <body></body> 标签与 <frameset></frameset> 标签同时使用!不过,假如你添加包含一段文本的 <noframes> 标签,就必须将这段文字嵌套于 <body></body> 标签内

 

  1. <html> 
  2.  
  3. <frameset cols="25%,50%,25%"> 
  4.  
  5.   <frame src="/header.html"> 
  6.   <frame src="/center.html"> 
  7.   <frame src="/footer.html"> 
  8.  
  9.   <noframes> 
  10.     <body>您的浏览器无法处理框架!</body> 
  11.   </noframes> 
  12.  
  13. </frameset> 
  14.  
  15. </html> 

 

说明:

<noframes> 标签用于浏览器无法显示框架时,考虑到用户体验给用户的提示。这在以前老式的浏览器里会用到,但现在的浏览器都支持frameset框架。

 

 

相关经验

导读书签
书签初始化中…