表格、框架及表单.ppt

目标 表格的使用 表格的格式 框架的使用 框架的格式 预习检查 请叙述表格是由哪两部分组成？ 创建一个表格必须需要哪些标签？ 本章任务 制作“宝贝分类”页面 制作“公告栏”页面 讲解目标 会使用表格的基本结构实现简单表格 会使用表格相关标签实现跨行、跨列的复杂表格 会使用表格相关设置进行美化修饰 表格的基本语法 如何创建表格 跨多列的表格 跨多行的表格 如何创建跨行跨列的表格 小结1 编写如下图所示效果对应的html代码 如何设置表格的尺寸和边框 如何设置背景 如何设置对其方式 为什么要使用填充属性 单元格里的内容太靠近边线，怎么办？ 什么是填充属性和间距属性 如何使用填充、间距属性 如何设置表格的填充属性 小结2 编写如下图所示效果对应的HTML代码 如何使用表格进行布局 如何使用表格进行布局 小结3 编写如下图所示效果对应的html代码 框架 框架使用场合 框架的基本结构 框架的基本结构 如何创建多个复杂的窗口 如何创建多个复杂的窗口 创建多个复杂的窗口实现步骤如下： 1、创建一个HTML页面“top.html” 2、创建一个HTML页面“left.html” 3、创建一个HTML页面“right.html” 如何创建多个复杂的窗口 4、新建多框架HTML页面“Frame_Sets.html” 如何设置窗口链接的显示位置 如何设置窗口链接的显示位置 target目标窗口属性 name＝“显示的窗口名” frame src=url name=“窗口名”　　 a href=url target=“窗口名” 如何设置窗口链接的显示位置 target目标窗口属性 四个特殊的窗口 a href=url target=“_blank” 显示在新窗口a href=url target=“_self” 显示在本窗口a href=url target=“_parent” 显示在父窗口a href=url target=“_top” 显示在整个浏览器窗口 小结2 编写如下图所示效果对应的html代码 frameset cols=“25%,50%,*” rows =“50%,*” border=“5” frame src=“the_first.html …… /frameset 框架页面的基本语法 边框尺寸大小 将窗口分割成左中右3个部分,可选 将窗口分割成上下2个部分,可选 第一个窗口要显示的网页 HTML HEAD TITLErows_cols框架/TITLE /HEAD FRAMESET rows=25%,50%,* border=5 FRAME name=“top src=the_first.html FRAME name=middle src=the_second.html FRAME name=“bottom src=the_third.html /FRAMESET /HTML 将窗口分割成上中下3部分 窗口边框的宽度 如果要在浏览器中创建左中右三个窗口,该如何实现？ 查看源代码 每个窗口对应一个页面，以及一个框架集页面，总共需要几个HTML页面文件？ 要实现如下图所示的窗口，该如何制作？ 1、分成上下两个窗口 2、把下面的窗口分成 左右两个窗口 top窗口 left 窗口 right窗口 top.html效果图 left.html效果图 right.html效果 ...... FRAMESET rows=20%,* frameborder=0 FRAME src=top.html name=topframe“ scrolling=no noresize=noresize FRAMESET cols=20%,* FRAME src=left.html noresize=noresize“ scrolling=no name=leftframe“ FRAME src=right.html name=rightframe /FRAMESET /FRAMESET 查看源代码 设置无框架边框 不显示滚动条 禁止调整框架大小 框架名称，便于超文本链接锚标签target属性所引用 如果在同一个页面中，要实现在一个框架窗口中的超链接页面出现在另一个框架窗口中，如何实现？ 演示示例2：不同框架之间超链接效果 使用target目标窗口属性 target属性指定了所链接的文件出现在名称为“窗口名”的框架窗口里。 Pa href=right.html target=rightframe IMG src=images/reg.jpg