新编-第12章-使用框架结构-精品课件.ppt

1、1HTML标准教程第第1212章章 使用框架结构使用框架结构HTMLHTML标标准准教教程程什么是框架什么是框架框架集标记框架集标记框架标记框架标记不支持框架标记不支持框架标记浮动框架浮动框架框架与链接框架与链接HTMLHTML标标准准教教程程1、作用：、作用：就是把浏览器窗口划分为若干个就是把浏览器窗口划分为若干个区域，每个区域可以分别显示不同的区域，每个区域可以分别显示不同的网页。网页。2、目的：、目的：创建页面导航。创建页面导航。HTMLHTML标标准准教教程程 框架主要包括两部分，一个是框架集，框架主要包括两部分，一个是框架集，另一个就是框架。另一个就是框架。框架集框架集：就是在一个文

2、档内定义一组框：就是在一个文档内定义一组框架结构的架结构的HTML网页。框架集定义了在一个窗网页。框架集定义了在一个窗口中显示的框架数、框架的尺寸、载入到框口中显示的框架数、框架的尺寸、载入到框架的网页等。架的网页等。框架框架：就是指在网页上定义的一个显示：就是指在网页上定义的一个显示区域。区域。HTMLHTML标标准准教教程程 基本框架代码基本框架代码 HTMLHTML标标准准教教程程1、左右分割窗口、左右分割窗口2、上下分割窗口、上下分割窗口3、嵌套分割窗口、嵌套分割窗口HTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：value为定义各个框架的宽度值，单

3、位可以是像为定义各个框架的宽度值，单位可以是像素，也可以是百分比。素，也可以是百分比。3、文件范例：、文件范例：12-1.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：value为定义各个框架的高度值，单位可以是像为定义各个框架的高度值，单位可以是像素，也可以是百分比。素，也可以是百分比。3、文件范例：、文件范例：12-2.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：HTMLHTML标标准准教教程程2、语法解释：、语法解释：上述代码先将框架按照行进行上下分割，然后上述代码先将框架按照行进行上下分割，然后在第二个框架中进行按照列的左

4、右分割。在第二个框架中进行按照列的左右分割。3、文件范例：、文件范例：12-3.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：设定框架集的边框宽度，单位为像素。设定框架集的边框宽度，单位为像素。3、文件范例：、文件范例：12-4.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：设定框架集的边框颜色。设定框架集的边框颜色。3、文件范例：、文件范例：12-5.htmHTMLHTML标标准准教教程程属性值属性值描描 述述cols左右分割左右分割rows上下分割上下分割framespacing边框宽度边框宽度bord

5、ercolor边框颜色边框颜色HTMLHTML标标准准教教程程 每一个框架都有一个显示的页面，这每一个框架都有一个显示的页面，这个页面文件称为个页面文件称为框架页面框架页面。通过。通过标记可以定义框架页面的内容。标记可以定义框架页面的内容。HTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：通过通过SRC属性设置框架显示的文件路径。属性设置框架显示的文件路径。3、文件范例：、文件范例：12-6.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：设定框架页面的名称。设定框架页面的名称。3、文件范例：、文件范例：12-7.ht

6、m框架命名规则：必须是单个单词，允许使用下划线，框架命名规则：必须是单个单词，允许使用下划线，但不允许使用连字符，句号和空格。框架名称必须但不允许使用连字符，句号和空格。框架名称必须以字母起始，而不能以数字起始。框架名称区分大以字母起始，而不能以数字起始。框架名称区分大小写。不要使用小写。不要使用JavaScript中的保留字作为框架中的保留字作为框架名称。名称。HTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：value取值为取值为0或或1，0为不显示边框，为不显示边框，1为显示边框。为显示边框。3、文件范例：、文件范例：12-8.htmHTMLHTML标标

7、准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：value取值见下表。取值见下表。3、文件范例：、文件范例：12-9.htmHTMLHTML标标准准教教程程Scrolling属性值属性值描描 述述yes显示滚动条显示滚动条no不显示滚动条不显示滚动条auto根据页面的长度自动判断是否显根据页面的长度自动判断是否显示滚动条示滚动条HTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：noresize代表禁止改变框架的尺寸大小。代表禁止改变框架的尺寸大小。3、文件范例：、文件范例：12-10.htmHTMLHTML标标准准教教程程1、基本语法：、基本语

8、法：2、语法解释：、语法解释：设定框架的左右边缘宽度。设定框架的左右边缘宽度。3、文件范例：、文件范例：12-11.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：设定框架的上下边缘高度。设定框架的上下边缘高度。3、文件范例：、文件范例：12-12.htmHTMLHTML标标准准教教程程属性值属性值描描 述述src源文件属性源文件属性name框架名称属性框架名称属性frameborder框架边框显示属性框架边框显示属性scrolling框架滚动条显示属性框架滚动条显示属性noresize框架尺寸调整属性框架尺寸调整属性marginwidth框架边缘宽度

9、属性框架边缘宽度属性marginheight框架边缘高度属性框架边缘高度属性HTMLHTML标标准准教教程程1、基本语法：、基本语法：HTMLHTML标标准准教教程程2、语法解释：、语法解释：放在放在标记之间的部分就是在不支持标记之间的部分就是在不支持框架的浏览器中显示的内容，也就是框架的浏览器中显示的内容，也就是标记标记中的内容。中的内容。3、文件范例：、文件范例：12-13.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：属性的含义见下表。属性的含义见下表。浮动框架是一种特殊的框架页面，在浏览器窗口浮动框架是一种特殊的框架页面，在浏览器窗口中中可以

10、嵌套子窗口，在其中显示页面的内容。可以嵌套子窗口，在其中显示页面的内容。HTMLHTML标标准准教教程程属属 性值性值描描 述述src浮动框架中显示页面源文件的路径浮动框架中显示页面源文件的路径width浮动框架的宽度浮动框架的宽度height浮动框架的高度浮动框架的高度name浮动框架的名称浮动框架的名称align浮动框架的排列方式浮动框架的排列方式(left center right)frameborder框架边框显示属性框架边框显示属性scrolling框架滚动条显示属性框架滚动条显示属性MarginWidth框架边缘宽度属性框架边缘宽度属性MarginHeight框架边缘高度属性框架边

11、缘高度属性HTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：通过通过src属性设置浮动框架显示的文件路径。属性设置浮动框架显示的文件路径。3、文件范例：、文件范例：12-14.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：通过通过width和和height属性设置浮动框架显示的宽属性设置浮动框架显示的宽度和高度。度和高度。3、文件范例：、文件范例：12-15.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：设定浮动框架的名称，命名规则同框架的设定浮动框架的名称，命名规则同框架

12、的name属性。属性。3、文件范例：、文件范例：12-16.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：value取值为取值为0或或1，0为不显示边框，为不显示边框，1为显示边为显示边框。框。3、文件范例：、文件范例：12-17.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：设定浮动滚动条的显示，设定浮动滚动条的显示，value取值见下表。取值见下表。3、文件范例：、文件范例：12-18.htmHTMLHTML标标准准教教程程scrolling属属 性值性值描描 述述Yes显示滚动条显示滚动条No不显示滚

13、动条不显示滚动条ruto根据页面的长度自动判断是根据页面的长度自动判断是否显示滚动条否显示滚动条HTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：设定浮动的边缘宽度。设定浮动的边缘宽度。3、文件范例：、文件范例：12-19.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：设定浮动的边缘高度。设定浮动的边缘高度。3、文件范例：、文件范例：12-20.htmHTMLHTML标标准准教教程程1、基本语法：、基本语法：2、语法解释：、语法解释：value取值为取值为left、center、right。3、文件范例：、文件范例：12-21.htmHTMLHTML标标准准教教程程 1、普通框架与链接、普通框架与链接 2、浮动框架与链接、浮动框架与链接文件范例文件范例:12-22.htm 12-23.htmHTMLHTML标标准准教教程程P304页页 1、2、3