1. 全栈程序员必看首页

HTML学习14：框架布局

全栈程序员-站长 • • 未分类 • 阅读 3

HTML学习14：框架布局文章目录 1 框架页面的基本结构 2 水平布局 3 垂直布局 4 混合框架集 5 为框架添加内容 6 改进 使用 name 属性 7 给框架布局设置一些属性相对 div 布局 框架布局是一个很古老 但是易于学习和掌握的布局技术 当一个网站中包含很多页面 每个页面又包含一些同样的区域的时候 我们可以选择框架布局 在现代前端开发中 框架布局已经被淘汰 取而代之的是 DIV 结合 Ajax 页面无刷新的加载技术 因此 这里只对框架布局做简单的介绍 1 框架页面的基本结构 HTML5 不支持标签 2 水平布局 3 垂直布局 4

文章目录

相对div布局，框架布局是一个很古老，但是易于学习和掌握的布局技术。当一个网站中包含很多页面，每个页面又包含一些同样的区域的时候，我们可以选择框架布局。在现代前端开发中，框架布局已经被淘汰，取而代之的是DIV结合Ajax页面无刷新的加载技术。因此，这里只对框架布局做简单的介绍。

1、框架页面的基本结构

在这里插入图片描述
HTML5 不支持 标签。

2、水平布局

在这里插入图片描述
在这里插入图片描述

3、垂直布局

在这里插入图片描述

4、混合框架集

在这里插入图片描述

5、为框架添加内容

6、改进：使用name属性

7、target

target属性表示链接打开方式

  • _self 当前窗口（默认）
  • _blank 新窗口
  • _parent 父框架集
  • _top 整个窗口
  • framename 指定框架

示例：


   
    "20%,*"> 
    
     "left.html" > 
     
      "50%,*"> 
      
       "80%,*"> 
       
        "middle.html" > 
        
         "right.html"> 
        
       
       
      
       "bottom.html" name=
       "bottom">

锚点页

在这里插入图片描述

8、给框架布局设置一些属性

noresize设置框架内部不可调整大小
frameborder="no"设置框架没有边框
在这里插入图片描述
设置框架各部分的比例，头部设置为100px，尾部设置为50px，*代表剩余的就是中间部分的高度。
在这里插入图片描述








在这里插入图片描述
scrolling="no"取消滚动条
在这里插入图片描述
在这里插入图片描述







版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。

发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/217328.html原文链接：https://javaforall.net

赞 (0)
0 0

关于作者

全栈程序员-站长的头像

全栈程序员-站长

133.5K 文章
3 粉丝
本网站汇聚当前互联网主流语音，持续更新，欢迎关注公众号“全栈程序员社区”
上一篇 2026年3月18日 上午9:49
下一篇 2026年3月18日 上午9:49


相关推荐

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号