HTML学习教程003(北大青鸟)

HTML学习教程001(北大青鸟),学完本门课程后,你能够制作界面美观大方、面向企业应用的静态商业网站,制作图文并茂的“广告”页面等。主要知识结构：001 HTML的基本标签 002 表格基础003 表单和框架004 CSS样式表005 使用DreamWeaver制作网页006 网站设计和页面布局技术(一)007 网站设计和页面布局技术(二)

第三章表单和框架

HTML学习教程001(北大青鸟),学完本门课程后,你能够制作界面美观大方、面向企业应用的静态商业网站,制作图文并茂的“广告”页面等。主要知识结构：001 HTML的基本标签 002 表格基础003 表单和框架004 CSS样式表005 使用DreamWeaver制作网页006 网站设计和页面布局技术(一)007 网站设计和页面布局技术(二)

回顾

使用HTML创建一个表格至少需要哪些标签？ 创建一个表格至少需要哪些标签？ 使用 创建一个表格至少需要哪些标签 跨多行表格是在单元格里用哪个属性进行设置 ？ 对表格进行美化，主要用哪些属性进行设置？ 对表格进行美化，主要用哪些属性进行设置？

HTML学习教程001(北大青鸟),学完本门课程后,你能够制作界面美观大方、面向企业应用的静态商业网站,制作图文并茂的“广告”页面等。主要知识结构：001 HTML的基本标签 002 表格基础003 表单和框架004 CSS样式表005 使用DreamWeaver制作网页006 网站设计和页面布局技术(一)007 网站设计和页面布局技术(二)

预习检查

请列举表单中有哪些常用的表单元素？ 请列举表单中有哪些常用的表单元素？ 创建一个框架页面至少需要哪几个标签？ 创建一个框架页面至少需要哪几个标签？

HTML学习教程001(北大青鸟),学完本门课程后,你能够制作界面美观大方、面向企业应用的静态商业网站,制作图文并茂的“广告”页面等。主要知识结构：001 HTML的基本标签 002 表格基础003 表单和框架004 CSS样式表005 使用DreamWeaver制作网页006 网站设计和页面布局技术(一)007 网站设计和页面布局技术(二)

本章任务制作“注册” 制作“注册”页面

制作“客户中心” 制作“客户中心”页面

HTML学习教程001(北大青鸟),学完本门课程后,你能够制作界面美观大方、面向企业应用的静态商业网站,制作图文并茂的“广告”页面等。主要知识结构：001 HTML的基本标签 002 表格基础003 表单和框架004 CSS样式表005 使用DreamWeaver制作网页006 网站设计和页面布局技术(一)007 网站设计和页面布局技术(二)

本章目标

会使用表单的基本结构制作表单页面 会使用各种表单元素实现注册页面 能理解post和get两种提交方式的区别 和 能理解 两种提交方式的区别 会使用框架结构实现多窗口展示页面

HTML学习教程001(北大青鸟),学完本门课程后,你能够制作界面美观大方、面向企业应用的静态商业网站,制作图文并茂的“广告”页面等。主要知识结构：001 HTML的基本标签 002 表格基础003 表单和框架004 CSS样式表005 使用DreamWeaver制作网页006 网站设计和页面布局技术(一)007 网站设计和页面布局技术(二)

表单反馈信息 表单的典型应用 注册用户 注册用户

收集信息 反馈信息 提供搜 索工具 收集信息

为网站提供搜索工具

HTML学习教程001(北大青鸟),学完本门课程后,你能够制作界面美观大方、面向企业应用的静态商业网站,制作图文并茂的“广告”页面等。主要知识结构：001 HTML的基本标签 002 表格基础003 表单和框架004 CSS样式表005 使用DreamWeaver制作网页006 网站设计和页面布局技术(一)007 网站设计和页面布局技术(二)

表单包含的控件单行文本输入 框(TEXT) 密码框 (PASSWORD)

单选按钮 (RADIO)

复选框 (CHECKBOX)

下拉列表 (SELECT)

重置按钮 (RESET) 多行文本框 (TEXTAREA)

提交按钮 (SUBMIT)

HTML学习教程001(北大青鸟),学完本门课程后,你能够制作界面美观大方、面向企业应用的静态商业网站,制作图文并茂的“广告”页面等。主要知识结构：001 HTML的基本标签 002 表格基础003 表单和框架004 CSS样式表005 使用DreamWeaver制作网页006 网站设计和页面布局技术(一)007 网站设计和页面布局技术(二)

表单页面的基本结构<FORM action=“http://www.77cn.com.cn” method=“post”> …… </FORM>

ACTION

METHOD 指定向服务器提交的方法: 指定向服务器提交的方法 一般为post或get方法 方法, 一般为 或 方法 post方法比较安全 方法比较安全

指定提交后， 指定提交后，由服务器 上那个处理程序处理

ACTION = “URL”

METHOD =“post或get” 或

演示示例1 post提交方式 get提交方式 演示示例1:使用 post提交方式 和 get提交方式

HTML学习教程001(北大青鸟),学完本门课程后,你能够制作界面美观大方、面向企业应用的静态商业网站,制作图文并茂的“广告”页面等。主要知识结构：001 HTML的基本标签 002 表格基础003 表单和框架004 CSS样式表005 使用DreamWeaver制作网页006 网站设计和页面布局技术(一)007 网站设计和页面布局技术(二)

表单元素的统一格式指定元素的类型， 指定元素的类型，可 为TEXT、RADIO、 、 、 SUBMIT等 等

控件的名称 控件的名称

控件的初始值 控件的初始值

<FORM name="form3" method="post" action=""> <INPUT type="checkbox" name="gen" value="男" 男 size="21“ maxlength=4 checked="checked"> …… </FORM>

控件的初始 控件的初始 宽度

控件中输入的 最多字符个数

控件是否 被选中

HTML学习教程001(北大青鸟),学完本门课程后,你能够制作界面美观大方、面向企业应用的静态商业网站,制作图文并茂的“广告”页面等。主要知识结构：001 HTML的基本标签 002 表格基础003 表单和框架004 CSS样式表005 使用DreamWeaver制作网页006 网站设计和页面布局技术(一)007 网站设计和页面布局技术(二)

表单元素的逐一介绍文本输入框 输入元素 的默认值

文本区的宽度

文本框基本语法<INPUT type=“text ” value="张三 size="20"> 张三" 张三

<FORM name="form1" method="post" action=""> <P>名&nbsp;&nbsp;字： 名 字 <INPUT type="text" value="张三 size="20"> 张三" 张三 </P> …… 单行文本输入框， 单行文本输入框， </FORM> 字符宽度为20 字符宽度为

查看源代码

HTML学习教程001(北大青鸟),学完本门课程后,你能够制作界面美观大方、面向企业应用的静态商业网站,制作图文并茂的“广告”页面等。主要知识结构：001 HTML的基本标签 002 表格基础003 表单和框架004 CSS样式表005 使用DreamWeaver制作网页006 网站设计和页面布局技术(一)007 网站设计和页面布局技术(二)

表单元素的逐一介绍

密码框基本语法

密码框

初始密码

密码区宽度

<INPUT type=“password ” value=“ 123456 ” size=“22”>

<FORM name="form2" method="post" action=""> …… <P>密&nbsp;&nbsp;码： 密 码 <I< …… 此处隐藏：4634字，全部文档内容请下载后查看。喜欢就下载吧 ……