HTML学习3--框架网页-阿里云开发者社区

开发者社区> 技术小胖子> 正文

HTML学习3--框架网页

简介:
+关注继续查看

 1.框架的基本概念:http://www.w3school.com.cn/

 

2.框架的基本结构:

 

注意事项:1.框架网页是没有body的!!!!

 


  1. <html> 
  2. <head> 
  3.     <meta http-equiv="Content-Type" content="text/html;charset=GBK" /> 
  4.     <title>框架网页-cols</title> 
  5. </head> 
  6.     <frameset rows="80,*" border="5"> 
  7.         <frame name="top" src="top.html"/> 
  8.         <frameset cols="400,*"> 
  9.             <frame name="left" src="http://www.baidu.com"/> 
  10.             <frame name="right" src="http://www.google.com.hk"/> 
  11.         </frameset> 
  12.     </frameset> 
  13. </html> 

注意事项:如果你想让框架网页之间的边框消失,要在frame标签中加上frameborder="0"这个属性!!


如果你不想框架网页之间的边框可以被随意拖动,那么你需要再frame标签中加上noresize="noresize"这个属性!

 

eg.


  1. <html> 
  2. <head> 
  3.     <meta http-equiv="Content-Type" content="text/html;charset=GBK" /> 
  4.     <title>框架网页-cols</title> 
  5. </head> 
  6.     <frameset rows="80,*" border="5"> 
  7.         <frame name="top" src="http://www.sina.com" frameborder="0"/> 
  8.         <frameset cols="400,*"> 
  9.             <frame name="left" src="http://www.baidu.com" frameborder="0"/> 
  10.             <frame name="right" src="http://www.w3school.com.cn/" frameborder="0" noresize="noresize"/> 
  11.         </frameset> 
  12.     </frameset> 
  13. </html> 

3.框架网页中的超链接:

 

target="blank" → 新窗口


target="parent" → 父窗口


target="right" → 去框架中的某个name="right"的窗口。当然,还可以有left,top等。

 

3.当你想在普通网页中引入其他的网页时,可以用iframe这个标签!

用法:

 


  1. <html xmlns="http://www.w3.org/1999/xhtml"> 
  2. <head> 
  3.     <meta http-equiv="Content-Type" content="text/html;charset=GBK" /> 
  4.     <title>iframe</title> 
  5. </head> 
  6. <body> 
  7.     <iframe src="http://www.baidu.com" frameborder="2" width="200" height="200" scrolling="no"/> 
  8. </html> 

它的一些属性:

 

 

 



     本文转自韩立伟 51CTO博客,原文链接:http://blog.51cto.com/hanchaohan/927271,如需转载请自行联系原作者








版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
学习HTML5十佳站点推荐
你可能还喜欢 九个让人难以置信的HTML5和JavaScript实验 推荐18个基于 HTML 5 Canvas 开发的图表库 让人眼花缭乱的 HTML5 和 JavaScript 效果 分享29款基于 HTML 5 Canvas 的网页游戏 HTML 5 标签、属性、事件及浏览器兼容性速查表   当下掀起一股HTML5学习热潮,越来越多的人尝试用HTML5来制作网页游戏等丰富的Web应用。
804 0
纯静态HTML网页页面的优点
纯网页HTML语言可以直接被搜索引擎所识别,但是asp语言需要经过解释,搜索引擎可能会在中途放弃收录,转到下一站点。所以HTML是建设网站的基本,每一次显示都是直接访问这个文件,这个页面是与数据库没有任何关系,同时要想修改网站,那必须修改网站模板,那么纯HTML网页的优点是什么呢?   1、如果是生成了HTML,更容易被搜索引擎收录和排名靠前,这是优点一,这也是大家使用HTML的主要目的。
772 0
sublime生成html骨架|学习笔记
快速学习 sublime生成html骨架
23 0
HTML标签 -特殊字符|学习笔记
快速学习HTML标签 -特殊字符
19 0
推荐21款最佳 HTML 5 网页游戏
  尽管 HTML5 的完全实现还有很长的路要走,但 HTML5 正在改变 Web,未来 HTML5 将把 Web 带入一个更加成熟和开放的应用平台。现在,越来越多的人尝试用 HTML5 来制作网页游戏等丰富的 Web 应用。
675 0
HTML标签- 锚点定位|学习笔记
快速学习HTML标签- 锚点定位
31 0
HTML骨架格式|学习笔记
快速学习HTML骨架格式
22 0
21119
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载