《项目二公开课教案教学设计课件资料.docx》由会员分享,可在线阅读,更多相关《项目二公开课教案教学设计课件资料.docx(5页珍藏版)》请在第一文库网上搜索。
1、任务一制作二维码登录页面活动1搜索二维码的生成方法二维码生成器的工作原理是将所需的信息输入二维码生成器中,生成相应的二维码,然后进行保存应用。二维码生成器的制作需要一个二维码生成算法,或者一个二维码插件,然后用JAVA,C#,VB等编程语言编写一个调用软件就可以做成二维码生成器了。小助手:二维码生成器的选择我们在网上搜索二维码生成器时需要注意以下几点:第一,输入目的明确的关键词。、网要让搜索引擎能准确地搜索出我们需要的资源就需要我们输入目的明确的关键词,如直接搜索“二维码生成“二维码生成器等。第二,选择相对值得信赖的下载地址。可以是搜索引擎中相对靠前的搜索结果,或者是下载排行网站中下载次数较多
2、、好评率较高的应用软件。知识链接什么是二维码二维条码/二维码(2-dimensiona1barCOde)是用某种特定的几何图形按一定规律在平面(二维方向上)分布的黑白相间的图形记录数据符号信息;在代码编制上巧妙地利用构成计算机内部逻辑基础的比特流的概念,使用若干个与二进制相对应的几何形体来表示文字数值信息,通过图像输入设备或光电扫描设备自动识读以实现信息自动处理。它具有条码技术的一些共性:每种码制有其特定的字符集;每个字符占有一定的宽度;具有一定的校验功能等。同时还具有对不同行的信息自动识别功能,以及处理图形旋转变化点。活动2实现二维码登录页面布局目前各大商务网站的二维码登录页面布局一般可以总
3、结为三块区域:顶部为公司1OG0,左下部为宣传海报右下部为二维码登录框。作业助手小助手1表格对话框当插入表格时,所弹出的对话框可以用来设置当前插入表格的属性,包括:表格大小、标题、辅助功能三大类。其中,在表格大小中,可以设置表格的行列数、宽度、边框,以及表格中各单元格的边距和间距。表格宽度:表格的宽度可以用像素作为单位进行设置,也可以用百分比作为单位进行设置。在利用百分比作为单位进行设置时,是相对于当前表格插入的位置而言的。表格边框:在边框粗细一栏,默认状态下,表格自带1像素的边框,如果想隐藏表格的边框必须将值设置为“0。单元格边距:是单元格中内容与单元格边框的距离,如图所示。单元格间距:是单
4、元格与单元格之间的距离,如图所示小助手2:图像调整单击图像可以在属性面板中对图像的各个属性进行修改。若图像尺寸过大或过小时,可以在属性面板中通过设置图像的宽与高重设图像的大小。当图像的宽高被锁定时,即出现图标,图像等比例放大或缩小;当图像的宽高解除锁定,即出现图标,图像可以自由设置宽与高。知识链接二维码扫描登录的整体架构在整个架构中,主要包含了几个模块:手机APP、浏览器、Web服务器以及存储服务(SeSion服务)。任务二制作网页登录页面活动一实现登录页面布局电商网站的登录页面中一般包含6个主要元素:账号输入框:用于采集用户账号信息。密码输入框:用于采集用户的密码信息。登录按钮:用于将账号和
5、密码信息提交到服务器。其他登录方式:用户登录网站的其他选择。忘记密码:用户用于获取密码的途径。立即注册:新用户注册会员的途径。作业助手小助手:图像属性面板我中需要编辑的图像,可以在软件界面下方的属性面板中查看到该图像的相关居性并进行修改,如图227所示。源文件输入框中所呈现的是图像的路径,在编辑栏中可以对图像进行裁剪、优化等图像处理。单击“优化按钮可以对图像进行缩放等处理。知识链接登录模块设计与实现功能:本模块主要用于对用户身份进行鉴别。用户通过表单提供用户名和密码信息,系统根据用户提供的登录信息对用户进行查询鉴别。如果身份合法,则用户可进入商品页面。输入操作:用户名、密码。对应处理:输入用户
6、的登录信息:在页面提供的表单处输入用户的用户名和密码信息,单击“登录按钮提交表单数据信息。也可单击“注册按钮,注册新用户。用户身份验证:连接数据库,打开USer集合,检验用户登录信息。以输入的“用户名”数据为查询条件来查看用户是否存在,如果存在,继续检验其输入密码是否正确,密码和用户名都正确,则进入商品展示页面;如果用户名不存在或密码不正确,则给出相应的提示。活动2实现登录页面功能表单是HTM1的一个重要部分,主要用于采集和提交用户输入的信息,是网站管理人员和用户之间沟通的桥梁。表单在网页中应用最多的就是一些用户信息的填写,例如,在登录某网站时,需要填写账号与密码,而这些填写个人数据的功能,都
7、是通过表单来实现的,表单可以向后台数据库提交这些数据。作业助手小助手:登录页面中出现的表单对象及其作用1文本域文本城有两种:一是文本字段,二是文本区域。文本字段是在表单城中插入一个可以输入行文本的文本城;文本区域是在表单城中插入一个可以输入多行文本的文本域。在Dreamweavr6中,选择【插入】【表单】/【文本城】可以插入一个文本字段。选择【插入】/【表单】/【文本区域】可以插入一个文本区域。如图235所示。单击文本城,可以在属性面板中设置字符宽度、最多字符数、类型等。字符宽度可用来控制文本域的宽度,最多字符数限制了文本城中输入字符的数量,类型可以实现文本城及文本区域的切换,若类型设置为“密
8、码,可以使文本域中的文本隐藏,以“的形式出现(图2-36)。2 .按钮在单击时执行操作。单击按钮可以在该按钮属性中为按钮添加自定义名称或标签,或者使用预定义的“提交”或重置标签,如图2-37所示,使用按钮可将表单数据提交到服务器,或者重置表单。您还可以指定其他已在脚本中定义的处理任务。3 .图像域图像域是指用在提交按钮位置的图像,使得这幅图像具有按钮的功能。一般来说,使用默认的按钮形式往往会让人觉得单调,若网页使用了较为丰富的色彩,或者稍微复杂的设计,再使用表单默认的按钮形式可能会破坏整体的美感。这时,可以使用图像域,创建和网页整体效果一致的图像提交按钮。知识链接表单代码1. form标签标签
9、用于为用户输入创建HTM1表单。表单能够包含input元素,如文本字段、复选框、单选框、提交按钮,等等。表单还可以包含menus、textareafie1dset、Iegend和Iabe1元素。表单用于向服务器传输数据。2. input标签用于收集用户信息。网根据不同的type属性值,输入字段拥有很多种形式。输入字段可以是文本字段复选框、掩码后的文本控件、单选按钮、按钮,等等。种登录实例:formaction=drnodemo-form.aspFirstname:1astname:Kinputtype=,submitva1ue=Submit如果您点击提交,表单数据会被发送到名为demo_for
10、m.asp的页面。代码效果如图238所示。3. buttonFirstname:标签定义一个按钮。Mickey在button元素内部,您可以放置内容,比如文本或图像。这是该元素与使用input元素创建按钮的不同之处。控件与相比,提供了更为强大的功能和更丰富的内容。与标签之间的所有内容都是按钮的内容,其中包括任何可接受的正文内容,比如文本或多媒体内容。例如,我们可以在按钮中包括一个图像和相关的文本,用它们在按钮中创建一个吸引人的标记图像。唯一禁止使用的元素是图像映射,因为它对鼠标和键盘敏感的动作会干扰表单按钮的行为。请始终为按钮规定type属性。InternetEXPIorer的默认类型是“bu
11、tton,而其他浏览器中(包括W3C规范)的默认值是“SUbmit”。任务三制作网页注册页面活动1实现注册页面布局小助手1:表格的合并合并单元格的方法一:选中要合并的单元格,单击【表格】/【合并单元格】,即可将单元格进行合并。合并单元格的方法二:选中要合并的单元格,在属性面板中单击合并单元格按钮即可完成单元格的合并。小助手2:表格的拆分拆分单元格的方法一:将光标移至需要拆分的单元格中,单击【表格】/【拆分单元格】,在弹出的对话框中选择把单元格拆成“行或“列,以及行(列)数,如图2-46所示,单击“确定按钮,完成拆分。拆分单元格的方法二:选中要拆分的单元格,在属性面板中单击拆分单元格按钮,在弹出
12、的对话框中设置拆分属性即可完成单元格的拆分。知识链接验证码的原理及作用验证码于服务器端生成,发送给客户端,并以图像格式显示。客户端提交所显示的验证码,客户端接收并进行比较,若比对失败则不能实现登录或注册,反之成功后跳转相应界面。目前,验证码被大多网站所支持并使用于注册登录。验证码能有效防止恶意登录注册,验证码每次都不同,就可以排除用其他病毒或者软件自动申请用户及自动登录,有效防止这种问题。活动2实现注册页面功能表单对象可以使设计人员能用表单中不同的元素与客户机用户相交互,而用不着提前进行数据输入,就可以实现动态改变Web文档的行为。表单对象最主要的功能就是可直接访问HTM1文档中的表单,它封装
13、了相关的HTM1代码。作业助手小助手:复选框复选框允许在一组选项中选择多个选项。用户可以选择任意多个适用的选项。选择“插入一表单一复选框,在弹出的对话框中输入好标签属性,如图2.50所示,单击“确定按钮即可插入复选框。选中复选框,可以修改图251中的属性。知识链接checkbox标签checkbox标签用于为用户输入创建复选框。复选框的语法及结构:使用htm1input标签,name为自定义,type类型为checkbox”的表单。实例:您喜欢的水果?inputname=Fruittype=checkbova1ue=,inputname=Fruittype=checkboVa1Ue=香蕉J代码效果如图2-52所示。