注册通行证 用户名 密码
  • 文章投稿
  • 博客
  • 论坛
  • 设为首页
  • 加入收藏
jztop.com网络技术
  • 首页
  • | iT新闻
  • | 操作系统
  • | 组网建网
  • | 网络安全
  • | 程序开发
  • | 办公一族
  • | 工具软件
  • | 网页制作
  • | 多媒体制作
  • | 网吧技术
  • | 服务器
  • | 专题教程
Vista | 软件评测 | 系统备份 | 优化 | 进程 | 聊天 | 病毒 | Linux | 黑客 | 防火墙 | 数据库 | Web开发 | Java | Word | 游戏 | 32位开发 | 移动开发
当前位置:首页 > 网页制作 > CSS技术应用 内容正文:网页制作基础技巧 框架(帧窗口)技巧

网页制作基础技巧 框架(帧窗口)技巧

发布时间:2006-10-11 11:45:52 来源:互联网 网友评论 0 条
  帧窗口是一种复杂的页面技术,应用帧窗口使得用户可以在同一个浏览器窗口中浏览不同网站的内容,可以在一个小窗口中发出查询命令而在另一个小窗口中接收查询结果。实现帧窗口的思路是将浏览器窗口按照功能分割成多个小窗口。每个窗口都对应有自己的HTML页面,按照一定的组合方式组合在一起,以实现特殊的效果。

  在HTML中用<frameset>(分割窗口标记)来分割窗口,<frameset>在多窗口页面中的地位就相当于<body>在普通单窗口页面中的地位,在页面中用<frameset>……</frameset>标志页面主体部分的起止位置。而且,<frameset>标记决定了怎样划分窗口,以及每个窗口的位置和大小。其基本语法结构如下:

  cols和rows:是决定页面如何分割的两个参数。分割左右窗口用cols,各帧的左右宽度用占窗口宽度的百分比来表示。比如:cols="30%,40%,*"就表示水平方向分割成三个窗口,各自所占总宽度的百分比依次是30%,40%和30%。其中"*"表示剩余部分,也就是说"*"对应的小窗口宽度为剩余的宽度。分割上下窗口用rows,同样采用百分比的设定方法。

  frameborder:是指定各分窗口是(ye)否(no)要加边框;如果加过框的话,则用 border参数指定边框的宽度,bordercolor指定边框的颜色。

  framespacing:用于设定各分窗口之间的间隔大小,默认值是0。

  用<frameset>标记把窗口分割好后,各窗口的属性是用HTML的<frame>标记来定义的,所以<frameset>标记中必须包含<frame>标记,用以定义各分窗口的属性。其语法如下:

  align:设定分窗口的位置是靠左(left)、靠右(right)、居中(center)、靠上(top)还是靠底(bottom)。

  name:用于指定分窗口的名称,src则用于指定分窗口所对应的HTML页面地址。

  noresize:是对用户来说的,当<frame>标记中包含此参数的时候,用户就不能用鼠标调整修改各分窗口的大小。

  scrolling:设定分窗口是否要滚动条。scrolling=no时不要滚动条,scrolling=yes时表示要滚动条,scrolling=auoto时表示根据实际情况自动设置滚动条。

  frameborder和bordercolor:是设定分窗口有无边框和边框颜色的。但对象只限于用<frame>标记的分窗口。

  marginheight和marginwidth:分别用于设定分窗口的上下边缘和左右边缘的宽度。

  用上面的两个标记,就能够实现多窗口页面,下面将举例说明。

  1、左小右大两窗口

  这种页面一般在左边的窗口放一个网站导航页,右面放网站页面内容。制作方法:

  先用<frameset>标记并通过设置其cols参数,沿水平方向分割成两个窗口,左边的窗口占20%,右边的窗口取剩余部分,再用<frame>标记分别定义两个窗口的属性。完成后的分帧页面源代码如下:

  从上面的代码看,设计帧窗口页面并没有想象得那么复杂,但以下几点在具体操作时要注意:

  1)用<frame>标记定义分窗口属性时,要注意其在<frameset>标记中的顺序,切不要搞乱了;

  2)分窗口的名称虽可随意定,但最好是以其所在位置命名比较好;

  3)分窗口的scrolling(滚动条)一般取其默认值"auto"比较好;

  4)虽然在最终往往不要分窗口的边框,但在设计阶段,还是设置为有边框比较好,这样在编辑时一目了然;

  5)上面页面代码中后面那句话一般加上为好,因为有的浏览器版本不支持分帧页面,若没加那名话,用户的浏览器若不支持分帧时,看到的是一片空白,不知是怎么一回事了,有那句话提示一下就明白了。

  2、一顶一左一右页面

  先看这种分帧页面的源代码:

  从上面的代码中可看出,建立复杂分帧页面的方法是由简到繁,如本例中,先用<frameset>定义其“rows”参数,把窗口分成上下两个窗口,再用<frame>标记定义上部窗口,因下部窗口还需再分,所以不用<frame>定义其属性,而是用<frameset>标记设置其cols参数,把它再分成左右两个窗口,因已达目的,所以开始用<frame>标记定义左右两个窗口的属性。

  只要记住:先粗分,后细分,cols横向分, rows纵向分,无需再分的窗口用<frame>定义属性,这些基本原则,制作分帧窗口页面就会轻松自如。

相关文章
  • Photoshop为照片添加漂亮的彩云效果
  • Photoshop为图片添加玻璃质感效果
  • Vista最后一个测试版RC 2官方下载
  • Google Toolbar浏览器搜索插件
  • 用robots.txt探索Google Baidu隐藏的秘密
【评论】【收藏本文】【打印】【关闭】
上一篇文章:网页制作基础技巧 框架(帧窗口)间的交互
下一篇文章:用css实现文字的自动隐藏
讨论区
查看
已有 0 位对此新闻感兴趣的网友发表了看法
匿名发表
注册通行证 登陆
图文阅读推荐
CSS的“顶级技巧”
CSS的“顶级技巧”
如何使用CSS来进行网页排版
如何使用CSS来进行网页排版
CSS样式表教程-If you love css …
CSS样式表教程-If you love css …
推荐阅讯
  • 玩转CSS CSS精彩实例教程(二)
  • 巧用CSS滤镜做图案文字
  • CSS样式表教程-If you love css …
  • 阿捷: 网站首页head区代码专业规范
  • CSS初级入门:文字的属性
  • 网页制作:几种所见所得的WEB在线编辑器
  • 一个针对IE7的CSS Hack
  • 网页风格化 用CSS实现皮肤适时切换
  • 完全用CSS实现的中英文双语导航菜单
  • 网页制作奇思妙想 表格也加滚动条
阅读排行
  • 1.如何使用CSS来进行网页排版
  • 2.CSS样式表教程-If you love css …
  • 3.CSS用样式表美化你的网页
  • 4.网页制作:几种所见所得的WEB在线编辑器
  • 5.网页常见可用性错误——表单组件错误
  • 6.CSS+JavaScript打造超酷右键菜单
  • 7.针对浏览器隐藏CSS之九大技巧
  • 8.DIV+CSS网页布局入门
  • 9.搜索引擎的蜘蛛人(ROBOTS)秘密
  • 10.CSS垂直树形下拉菜单
专题教程
  • 大话G游 专题:手机病毒揭密
  • ARP攻击防范与解决方案 路由故障处理手册
  • Picasa中文版_Picasa教程 专题:清除流氓软件
  • Firefox专题 seo搜索引擎优化专区
  • 重装Windows必知的事情 装机之必备软件大行动
病毒专杀栏
  • 杀毒软件反被病毒杀 连"救命"都不能喊
  • 金山ARP防火墙
  • 还原卡神话破灭“机器狗”病毒来势汹汹
  • cctv经济半小时:你的手机现在安全吗?
  • 新挂马方式开始流行 ARP挂马称雄局域网
  • 木马和病毒清除的通用解法
  • IP地址不再冲突 查找ARP攻击者元凶
  • 教你几招识别和防御Web网页木马
  • 分析:封杀BT只是暂时的止痛药
  • QQ爆危险漏洞,“QQ游戏邀请大盗”邀请你玩病
关于我们 | 诚聘英才 | 联系我们 | 版权声明 | 网站大事 | 网站地图 | 意见建议
CopyRight 2005-2007 Jztop.Com 版权所有 未经许可 请勿转载