• web框架


    目录

    1 左右分割窗口

    2 上下分割窗口

    3 嵌套分割窗口

    4 内联框架


    框架的作用是把浏览器窗口划分成若干个小窗口,每个小窗口可以分别显示不同的网页。

    框架的基本结构主要分为框架集和框架两个部分,在网页中分别用<frameset>和标记定义。其基本语法的定义方法如下:

    1. <frameset>
    2. <noframes>
    3. 不支持框架结构显示页面!
    4. noframes>
    5. <frame src="URL">
    6. frame>
    7. ......
    8. <frameset>

    注意:一个框架集中可以包含多个框架,每个框架窗口显示的页面由框架的src属性指定。

    标记有两个对窗口页面进行分割的属性:rows和cols,

    这两个属性可以将浏览器页面分为N行M列。也可以各自独立使用。

    这两个属性对浏览器窗口的分割方法主要有以下几种类型:左右(水平)分割、上下(垂直)分割、嵌套分割(既存在左右分割、又存在上下分割)。
     

    1 左右分割窗口

    1. <frameset cols= "value1, value2,...">
    2. <frame src="URL">frame>
    3. <frame src="URL">frame>
    4. frameset>

    注意:cols属性值的个数决定了标记的个数、即分割的窗口个数。各个值之间使用逗号隔开,各个值定义了相应框架窗口的宽度、可以是数字(单位是像素)也可以是百分比和以号"*"表示的剩余值。

    例如:

    1. html>
    2. <html>
    3. <head>
    4. <meta charset="utf-8">
    5. <meta name="viewport" content="width=device-width, initial-scale=1">
    6. <title>左右分割窗口title>
    7. head>
    8. <frameset cols="200,*">
    9. <frame src="http://www.baidu.com">frame>
    10. <frame src="http://www.taobao.com">frame>
    11. frameset>
    12. html>

    2 上下分割窗口

    语法格式:

    1. <frameset rows= "value1, value2,...">
    2. <frame src="URL">frame>
    3. <frame src="URL">frame>
    4. frameset>

    注意:rows属性值的个数决定了标记的个数、即分割的窗口个数。rows属性定义的是窗口高度,与cols属性的取值不同。

    例如:

    1. html>
    2. <html>
    3. <head>
    4. <meta charset="utf-8">
    5. <meta name="viewport" content="width=device-width, initial-scale=1">
    6. <title>上下分割窗口title>
    7. head>
    8. <frameset rows="200,*">
    9. <frame src="http://www.baidu.com">frame>
    10. <frame src="http://www.taobao.com">frame>
    11. frameset>
    12. html>

    3 嵌套分割窗口

    嵌套分割需要在标记对内再嵌套标记,并且子标记将会把父标记分割的对应窗口再按指定的分割方式进行第二次分割。其语法的定义格式如下:

    1. <frameset rows"value1, value2,...">
    2. <frame src="URL">frame>
    3. <frameset cols="value1, value2,...">
    4. frameset>
    5. frameset>

    例如:

    1. html>
    2. <html>
    3. <head>
    4. <meta charset="utf-8">
    5. <meta name="viewport" content="width=device-width, initial-scale=1">
    6. <title>嵌套分割窗口title>
    7. head>
    8. <frameset rows="100,*">
    9. <frame src="http://www.taobao.com">frame>
    10. <frameset cols="200,*">
    11. <frame src="http://www.baidu.com">frame>
    12. <frame src="http://www.sohu.com">frame>
    13. frameset>
    14. frameset>
    15. html>

    4 内联框架

    1.<iframe>标记规定 一个内联框架。

    2.内联框架用来在当前HTML文档中嵌人另一个文档。

    3.