码迷,mamicode.com
首页 > 其他好文 > 详细

创建框架结构的页面

时间:2017-11-28 21:49:50      阅读:174      评论:0      收藏:0      [点我收藏+]

标签:row   nbsp   eset   size   方法   不能   滚动条   论坛   作用   

 

框架指的是一种布局

 

1.创建窗口框架页面:
有的网页,像论坛,就左侧是导航栏,右侧是论坛主体,单击左侧导航栏,则在右侧显示链接页面。这个布局是将浏览器分为左右两部分。

创建窗口框架的<frameset>和<frame>标签。
使用<frame>标签在HTML 页面中设置框架,那么当一个浏览器被分为很多个框架时,这些框架放在一起,称为框架集。 框架集的html标签为<frameset>也称为框架结构标签。
如果要在框架中放入内容,采用的方式是通过引用所放内容的路径来加载对象
<framesset….>
  <frame src=…..>
  <frame src=…..>
</frameset>
(不能将<frameset>标签和<body>标签一起用。因为框架分割的是浏览器,理论上至少也需要两个标签组成。所以不存在只有一个框架页面。而且框架集的作用是将多个页面同时展示在浏览器中,同样也不存在包含框架的独立页面。所以不能一起用喔。)

 

2.横向分割窗口:
窗口的分割只有横纵连个方向,没有斜方向的切割方法。横向分割窗口,使用row属性,代码:
<frameset rows="框架高度,框架高度,…..*"> (框架高度可以用像素或者百分比来表示)
(*表示最后一个框架的高度,就是说剩下的最后一个也就无需用数值表示)
<html>
  <head>
  <title>横向分割窗口</title>
  </head>
  <frameset rows="40%,40%,*">
    <frame></frame>
    <frame></frame>
    <frame></frame>
  </frameset>
</html>

技术分享图片

3.纵向分割窗口:
使用的是cols属性
<frameset cols="20%,40%,*">

(在HTML中,<frame>标签不需要关闭,但是在xhtml中,<frame>标签必须被正确地关闭)

 

4.框架的嵌套:

框架的嵌套就是说如果同时混合使用横纵结构,即在分割的框架中再嵌套一个框架集。

<html>
    <head>
        <title>框架的嵌套</title>
    </head>
    <frameset cols="25%,*">
        <frame></frame>
        <frameset rows="40%,*">
            <frame></frame>
            <frame></frame>
        </frameset>
    </frameset>
</html>

 这个框架可以看作大框架中的一个子框架

 

5.将页面放入窗口框架中:
需要在框架中通过路径的方式来添加页面。
<frame src="傻逼主页.html">

 

6.修饰框架的细节:
在框架设计页面时,有时候会遇到不能显示框架的浏览器,在这时候就可以用<noframes>标签加以注释。
<frameset>
<frame>
<frame>
<noframes>
<body>
很抱歉,您的浏览器无法处理框架
</body>
</noframes>
</frameset>

固定框架的位置:
设定好框架的位置后,框架并不是固定的,通过拉拽框架集的边框,大小是会变的。
可以用<noresize>标签来固定标签。
<frame noresize="noresize">

框架中设置滚动条: 可以通过scrolling属性来实现这种控制。
<frame src="klsafj.html" scrolling=auto>//设置滚动条是自动的,即根据页面的内容是否超出框架范围决定是否出现滚动条
<frame src=".." scrolling=no>//表示不现滚动条
<frame src="…" scrolling=yes>//无论页面内容是否超过框架范围,都将显示滚动条。

 


7.修改框架边框的样式:
1.判定边框是否显示: 用frameborder属性可以决定是否显示边框
<frame frameborder="0" src="">如果写成0则不显示,如果写成1则显示。
2.改变边框的表现效果:
border表示框架的边框。在这个属性上可以扩展出一些新的特性。如bordercolor
<frameset rows="30%,*" border=23px bordercolor="#FF0000">

 

8.边框的边距:
就是指框架内页面内容和边框的距离。使用margininwidth属性设置左右两边的边距。使用marginheight属性设置上i行啊两边的边距 这几个属性可以控制文字在边框中的位置

 

创建框架结构的页面

标签:row   nbsp   eset   size   方法   不能   滚动条   论坛   作用   

原文地址:http://www.cnblogs.com/wangshen31/p/7912046.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!