如何在html中设置框架集

框架集包含<frameset>和<frame>两个标签,其中<frameset>描述窗口的分割,<frame>定义放置在每个框架中的HTML页面。

如何在html中设置框架集

工具/原料

  • 基本语法如下:

    <frameset cols="25%,50%,*" rows="50%,*" border="5">

    <frame src="the_first.html">

    <frame src="the_second.html">

    ......

    </frameset>

方法/步骤

  1.  

    1.纵向分割窗口

    <html>

    <head>

    <title>rows纵向分割为3个窗口</title>

    </head>

    <frameset bordercolor="red" rows="25%,50%,*" border="5">

    <frame src="subframe/the_first.html" name="top"/>

    <frame src="subframe/the_second.html" name="middle"/>

    <frame src="subframe/the_thdrd.html" name="bottom"/>

    </frameset >

    <html>

    如何在html中设置框架集
  2.  

    2.横向分割窗口

    <html>

    <head>

    <title>cols进行纵向分割</title>

    </head>

    <frameset bordercolor="#FF0000" cols="200,*,200" border="5">

    <frame name="leftFrame" src="subframe/the_first.html" />

    <frame name="mainFrame" src="subframe/the_second.html" />

    <frame name="rightFrame" src="subframe/the_third.html" />

    </frameset >

    <html>

     

    如何在html中设置框架集
  3.  

    3.横向和纵向同时分割窗口

    <html>

    <head>

    <title>创建多框架页面</title>

    </head>

    <frameset rows="20%,*" frameborder="0">

    <frame src="subframe/top.html" name="topFrame"  

    scrolling="no" noresize="topframe"/>

     <frameset cols="20%,*">

       <frame src="subframe/left.html" name="leftframe"

       scrolling="no" noresize"noresize">  

     <frame src="subframe/right.html" name="rightframe">

     </frameset >

    </frameset >

    <html>

     

     

    如何在html中设置框架集

注意事项

  • 要实现上述框架效果,除边框外,还需用框架的其他修饰属性。例如,是否允许调整各框架窗口的大小,则使用“noresize” 属性设置;当框架内的页面内容较多时,是否需要显示滚动条,则使用“scrolling”属性设置。

你可能感兴趣的:(html,UI)