实训一、创建个人网站
课时:2
任务一、 规划个人网站
一、提出任务
1.任务目标
规划个人网站。
2.解决的问题
通过规划个人网站了解网站主题对于网站的意义,了解网站的栏目与目录结构之间的关系及开发网站的常用工具软件。
二、任务内容
1.通过互联网浏览网站,总结所浏览网站的主题类型,至少出企业宣传、软件下载、求
职招聘、专业论坛、流行时尚、互动聊天和在线销售类型的网站各一个,记录它们的网站名称填入教材p4表JYFS1-1中:
省委办公厅根据表格内的提示,使用搜索引擎查相关类型网站。
每组4名同学,每人负责两个主题的网站搜索。
任务二 创建站点
一、提出任务
1.任务目标
创建个人网站站点。
2. 解决的问题
使用网页制作软件Dreamweaver cs5,按照个人网站的制作要求创建网站站点。
二、任务内容
1.新建一个站点,名称为“pra1-1”,使用“高级”选项卡完成新建过程,保存位置为“D:\pra1-1”,其他参数保持默认即可。
2.新建一个以自己姓名命名的个人站点,该站点使用“ASP JavaScript”服务器技术,暂不设置远程信息与测试服务器,站点保存在“D:\pra1-2”文件夹中。
任务三 管理站点
一、提出任务
1.任务目标
管理个人网站站点。
2. 解决的问题
通过完成本任务学习使用Dreamweaver cs5进行站点管理。
3. 本任务所涉及原有知识要点
完成本任务所涉及原有知识要点有:启动Dreamweaver cs5,创建网站站点。
二、任务内容
1.新建站点“pra1-5”,使用管理站点功能将其导出。将站点导出文件通过网络或移动存储设备拷贝到其他计算机中,使用管理站点功能将其导入。
2.新建站点“pra1-3”,使用管理站点功能复制站点“pra1-3”,编辑复制的站点名称为“pra1-4”,之后删除站点“pra1-3”。
任务四 创建网站目录结构
一、提出任务
1.任务目标
创建网站目录结构。
2. 解决的问题
本任务将使用“文件”面板,实现先前规划的网站目录结构,学习在本地站点建立文件和文件夹的方法,管理站点内的文件。
3. 本任务所涉及原有知识要点
完成本任务所涉及原有知识要点有:打开Dreamweaver cs5、管理站点知识。
二、任务内容
1.使用“文件”菜单新建“ASP JavaScript”类型的动态页,文件保存为“D:/ practice 1-1.asp”,使用属性面板修改网页标题为“ASP网页”。
2.新建站点“pra1-7”,使用“文件”面板创建一个网页文件,命名为“practice1-2.html”,选中该文件后使用下拉菜单中的重命名选项,改名为“newpage.html”,同样使用下拉菜单中的选项预览页面后删除该页面。
实训二、添加首页内容
课时:2
任务一 添加首页文本
一、提出任务
1.任务目标
完成首页文本内容。
2. 解决的问题
通过完成本任务学习修改网页标题,在网页中添加文本,分段换行和段内换行,输入连续空格,保存和预览网页等知识。
二、任务内容
调节电脑亮度1.新建一个网页“practice2-1.html”,将本单元素材“举一反三”文件夹中“” 的文本内容拷贝到页面中,使用插入空格的方法修改文本,使每一行文本中的“vs”字样达到对齐的效果。
2.新建一个网页“practice2-2.html”,输入多行文字内容并进行分段和强制换行,修改网页标题为“换行效果预览”,保存后预览页面,观察在IE浏览器中标题在什么位置,浏览器窗口大小发生变化时,对三种换行方式的影响。
任务二 编辑文本样式
一、提出任务
1.任务目标
完成首页文本样式设置,添加水平分隔线与列表。
2. 解决的问题
本任务通过设置首页文本样式,学习文本样式设置与应用,修改文本样式,添加水平分隔线与列表知识。
3. 本任务所涉及原有知识要点
完成本任务所涉及原有知识要点有:输入文本内容的方法,段内换行与划分段落方法,输入连续空格的方法。
二、任务内容
1.新建一个网页“practice2-4.html”,插入5条水平线,使用属性面板进行不同的宽、高、对齐与阴影属性设置,预览页面并比较不同属性的设置效果。
2.新建“班级荣誉”页面,文件名为“practice2-5.html”,列举班级成员所获奖励,设置为编号列表,修改文本样式,用不同的文本大小、颜区分奖励的等级,保存并预览页面。尝试先设文本样式后设编号列表有何区别。(要求各组课下搜集班级成员获奖情况,并制定一个设置方案)
任务三 添加图像
一、提出任务
1.任务目标
为首页添加图像内容。
2. 解决的问题
本任务通过为首页添加图像内容,学习在网页中插入图像和编辑图像的方法。
二、任务内容
1.将本单元素材文件夹中的“jyfs1.jpg”插入到一个新建页面“practice2-7.html”中,裁剪后宽度为200像素,高度为100像素,并设置边框宽度为5,完成后预览页面。
2.新建网页“practice2-8.html”,插入本单元素材文件夹中的“jyfs2.jpg”,尝试使用Dreamweaver 8的图像编辑功能修改图像的亮度并进行锐化设置。
任务四 创建与应用CSS美化网页
一、提出任务
1.任务目标
使用CSS美化网页。
2.解决的问题
本任务通过为对首页进行美化,学习应用CSS样式。
3.本任务所涉及原有知识要点
完成本任务所涉及原有知识要点有:在网页中输入文本内容、插入图像及水平线。
二、任务内容
1.新建网页“practice2-9.html”,插入3条水平线,定义3种“类”样式“l1”、“l2”、“l3”。定义过程中修改样式中的边框属性,使其拥有不同的效果,分别应用在各条水平线上,预览页面。
2.将本单元素材佛山电台“举一反三”文件夹中的网页“practice2-11.html”拷贝到D盘根目录下,定义“标签”样式“p”,设置文本大小与颜,保存后预览页面观察效果,之后定义“类”样式“p1”,设置不同的文本大小与颜,并应用于页面中所插入的文本,浏览页面观察效果,
总结“类”样式与“标签”样式的区别。
谷歌账户注册3.新建网页“practice2-10.html”,插入本单元素材“举一反三”文件夹中的“jyfs3.jpg”和一条水平线,定义“类”样式“line1”,修改样式中的边框属性。分别将该样式应用在页面中的图片与水平线上,预览页面,分析样式设置的结果。
实训三、创建、编辑表格
课时:4
任务一 创建表格
一、提出任务
1.任务目标
完成“作品展示”网页中表格的创建。
吴镇宇儿子怎么受伤的
2.解决的问题
通过在“作品展示”网页中创建表格理解表格布局页面的重要性,学习网页的布局分析,掌握创建表格的几种方法。
3.本任务所涉及原有知识要点
完成本任务所涉及原有知识要点有:在页面添加文本,设置文本格式,插入图像,设置图像格式。
二、任务内容
1.创建网页“practice3-2.html”,在网页中插入如图JYFS3-1所示的嵌套表格,保存并预览网页。
图JYFS3-1
2.创建网页“practice3-3.html”,在网页中插入如图JYFS3-2所示的嵌套表格,保存并预览网页。
图JYFS3-2
3.制作一个以环保为主题的网页,首先利用已学知识设计栏目和目录结构,创建表格布局网页。
任务二 编辑表格
一、提出任务
1.任务目标
编辑已创建成的表格。
2. 解决的问题
通过对本单元任务一创建的表格进行编辑,学习更改表格边框或背景颜,添加、删除行或列,调整行高、列宽及表格大小,拆分或合并单元格。
3. 本任务所涉及原有知识要点
完成本任务需要掌握以前学过的利用表格布局页面,创建表格等知识点。
二、任务内容
1.创建网页“practice3-5.html”,插入如图JYFS3-4所示表格并按要求设置其属性:宽400像素、高100像素、单元格间距为5像素、边框粗细为3像素、边框颜为“#FF0000”。表格第1、3列宽100像素、单元格的边框颜为“#00FF00”,第研究发现喝无糖碳酸饮料更易发胖2列宽100像素、单元格的边框颜为“#0000FF”。
图JYFS3-4
2.创建网页“practice3-6.html”,插入一个4行3列的表格,按图JYFS3-5所示,对单元格进行合并与拆分。设置表格边框粗细为1像素、颜为“#000000”,将表格第1行的背景颜设置为“#3399CC”,第2行与第3行的第一列单元格、第4行第1、2列单元格的背景颜设置为“#FFFFCC”。
发布评论