admin管理员组文章数量:1533882
2024年4月30日发(作者：)
课题 实现登录页面布局
（1）了解网页登录页面的元素。
课时 1
教学目标
（2)能利用PHOTOSＨＯP制作登录页面所需的图像。
（3）能利用Ｄreamｗeaｖer cｓ5实现登录页面的布局。
(4)会使用属性面板并进行相应修改。
重点
难点
掌握创建站点、插入表格、插入图像、保存、预览等基本操作
登录页面的布局，单元格属性的设置
教学
重难点
课前准备
教师准备 PＰT课件,案例，上机环境
学生准备 熟悉Ｄreaｍweaver cs5的界面,会进行站点的操作
教学过程设计
第一环节
创设情景
导入课题
展示电商网站“京东”登录页面。
任务１：请学生观看登录页面,回答它包含了哪些主要元素?
:(1)账号输人框:用于采集用户账号信息。
(２)密码输人框:用于采集用户的密码信息。
（3）登录按钮:用于将账号和密码信息提交到服务器。
(4)其他登录方式：用户登录网站的其他选择。
(5)忘记密码:用户用于获取密码的途径。
(6)立即注册:新用户注册会员的途径。
第二环节
任务2:用PＨOＴOSHOＰ制作登录页面所需的图像
新课教学
如果无法完成的同学，就利用老师准备的素材做任务３
1 / 8
任务３:实现登录页面的布局
(1)创建站点(yｍzz０1），新建并保存文件(iｎdｅｘ)。
网页需要保存在站点中。打开“文件”菜单,选择“保存”命令,或按快捷
键〈Ctrl〉+〈S〉,将弹出“另存为”对话框,选择保存的位置并输入保存文件
名，单击“保存”按钮即可将网页保存。
注意：文件名通常使用小写英文字母,不使用空格、特殊符号，不要使用中
文。文件命名尽量以四种方式命名：汉语拼音、汉语拼音缩写、英文或英文缩
写,以方便通过文件名直观地了解页面内容。
(2）插人表格。设置表格为行-列,宽 ４２４(像素)边框１（像素）,表格居中
对齐。如图右图所示。
100%,表格居中对齐,如下图所示
。
(3)嵌套表格。在当前表格中插人一个新的表格， 设置表格为9行1列、宽
2 / 8
版权声明：本文标题：制作网页登录页面-【经典教育教学资料】 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://m.elefans.com/dianzi/1714473759a406612.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论