* 第10章小结
标签中的常用属性:name,action,method 输入元素的类型,各元素的属性 Text,password File Checkbox,radio Button,submit,reset Image 多行文本域标签及各种属性 下拉列表标签、下拉列表选项标签、各种属性(Size、Multiple、Selected) * 设计如图所示表单界面 .input1 { background-color:F7F1E7; border:1px solid #0000ff; } * 参考答案: 学员很可能回答不全,教员给以鼓励,同时给予补充完整。 1)表单用于收集客户端浏览者的信息;表单有action动作、method方法属性。 2)文本框分为:单行文本框、密码框、文本域(多行文本框) 3)使用最多字符数(最多长度)属性。 4)单选按钮用于多选一,而复选框预允许多选多。 * 1.提问:HTML语言是用来做什么? 引导:做网页。 顺便告诉学员,DreamWeaver能自动生成HTML代码,但是有时我们还是需要人工修改HTML代码。我们在实现动态网页时,更需要理解、阅读HTML代码,因此非常重要。 2.强调HTML的功能: 规定网页内容的显示格式。 * 向学员解释: 1)HTML网页的标签讲究配对,开始,结束 2)HTML网页和人一样,由头部和主体两部分组成 * 向学员解释: 标签一般由两部分组成:标签和属性, 例如: …. BODY就是标签, bgcolor=“green”就是属性,属性可选,还可以多个。 * 演示:字体Font的用法,参见TG4-Source文件夹中“字体“用例。强调三个属性: 1)Face字体 2)size 大小 3)color 颜色 * * 演示: 自动刷新的例子:网页代码详见TG4-Source文件夹中的用例。 向学员说明:网页中的其他代码是JavaScript,后续章节会讲解。 * 讲解要点: 引入话题:如果一个城市的天气气候每天一成不变,都是夏天或冬天,这样好吗? 引导:学生可能会说四季如春,当然好啊,引导:天气气候应该动态变化,“四季分明”, 这才适合自然界生物的生长,我们的网页也是如此,样式不能一成不变,应给人一种鲜活的动态感受,吸引浏览者。 1.使用DHTML的目的是实现动态网页,使网页产生一些动态效果, 演示动态效果:参见TG6-Source文件夹中“超链接变色”和“超链接背景切换” 用例 1)超链接变色:鼠标移过去超链接会变色。 2 )超链接背景切换:上机我们将做此练习,鼠标移过去,背景切换。 2.DHTML包括三部分内容: HTML、层叠样式表、脚本语言 * 提问:我们以前学习的
标段落标签显示时是什么颜色? 回答:毫无疑问,黑色。 告诉学员: 1)如果把网页内容比喻为一个女孩的话,样式就好比这位女孩穿的衣服。 女孩喜欢用漂亮的衣装来打扮自己,同样,我们的网页也需要华丽的样式来包装。 2)
等标签都是默认为黑色白底,如果希望改变这些默认效果,就必须自定义新的样式。 演示:参考TG6-Source文件夹中的”什么是样式“用例。 * * 提问:我们以前学习的
标段落标签显示时是什么颜色? 回答:毫无疑问,黑色。 告诉学员: 1)如果把网页内容比喻为一个女孩的话,样式就好比这位女孩穿的衣服。 女孩喜欢用漂亮的衣装来打扮自己,同样,我们的网页也需要华丽的样式来包装。 2)
等标签都是默认为黑色白底,如果希望改变这些默认效果,就必须自定义新的样式。 演示:参考TG6-Source文件夹中的”什么是样式“用例。 * 提问:我们刚才的行内样式表可以让个别段落与众不同,但是有缺陷: 如果我们希望所有的段落都采用统一的样式呢? 引导:在每个
标签后都加上相同的样式代码,太麻烦了。怎么办? 很简单,把统一的样式放在
标签内,让本网页的所有段落
标签共享同一样式。 这就是我们要讲的内嵌样式表。 告诉学员: 1)选择器:表明此样式作用于哪个HTML标签。 2)样式规则之间用分号分割开 3)定好样式后,它将对本网页内所有的同类标签(如
)起作用。 演示:参考TG6-Source文件夹中的”什么是内嵌样式“用例。 * * 讲解要点: 1)先演示:参考TG6-Source文件夹中的”HTML选择器“用例。 2)指出: 品种特征-
下面的三段都是段落
, 3)提问:我们应该采用哪些标签的样式呢? 4)回答:显然是
和
标签。 5)讲解关键代码