网页设计期末练习解析Word格式.docx
- 文档编号:17384558
- 上传时间:2022-12-01
- 格式:DOCX
- 页数:12
- 大小:606.28KB
网页设计期末练习解析Word格式.docx
《网页设计期末练习解析Word格式.docx》由会员分享,可在线阅读,更多相关《网页设计期末练习解析Word格式.docx(12页珍藏版)》请在冰豆网上搜索。
,命名为"
mysite"
;
设置本地根文件夹,指定为E盘下的root文件夹;
HTTP地址"
为localhost。
创建与设置文档的页面属性:
新建一个页面,设置文档页面属性:
标题设置为"
我的班级"
,背景图像设置为image\0l.jpg图像,左边界、边界宽带、顶部边界以及边界高度分别设置为20
设置页面中文字的字体、字体大小:
选择文字部分,在属性面板设置字体及字体的大小。
为整个页面添加一个背景音乐。
在代码视图下在<
body>
和<
/body>
之间如下添加代码:
<
embedsrc=01.mp3hidden=trueautostart=true>
保存文件,预览文件效果。
实训过程注意事项
在创建站点的过程中注意建立本地文件夹,文件夹命名最好为英文;
网站中所有的文件最好取名为英文;
注意文件的路径;
所有的图片文件单独放在image文件夹内。
背景音乐必须放在站点文件内。
页面效果图
图1-1
实训2文本操作
为了让学生能熟练掌握在Dreamweaver中如何输入文本,调整设置文本的格式;
如何插入特殊字符、文本列表、水平线、时间、注释的方法。
输入文本:
调整文本:
插入特殊字符:
插入文本列表:
插入水平线:
插入时间:
插入注释:
设置文本格式:
要求学生掌握在Dreamweaver中输入文本、设置文本格式、插入特殊字符、项目符号等操作。
打开上次实训所做的页面文件;
输入文本,调整文本的间距,设置文本的格式;
通过“属性”面板中的“格式”和“颜色”等参数,将文字设为标题格式,并改变其颜色;
输入一段不带格式的文字,选择“常用”工具栏上的“文本”单选项目,利用换行按钮对文本进行换行处理,实现分段的效果;
插入特殊字符、项目符号、水平线、时间、注释等内容;
在“编辑字体列表”对话框中选择要添加的字体要一个个地添加进去,不能全部选取再添加;
当输入文本时要插入多个连续的空格,必须要“编辑”菜单下的“首选参数”中设置;
换行的几种方式:
自行换行;
按ENTER强行换行;
按SHIFT+ENTER换行操作;
图1-2
实训3图像操作
为了让学生熟练掌握在Dreamweaver中插入图像,学会设置图像属性;
如何插入鼠标经过图像、插入图像占位符的方法,掌握图文混排的技巧等操作。
插入图像:
设置图像属性:
插入鼠标经过图像:
插入图像占位符:
图文混排操作:
要求学生掌握在Dreamweaver中如何插入图像、设置图像的格式;
如何插入鼠标经过图像、图像占位符;
掌握图文混排等操作。
插入图像,在属性面板对图像的格式进行设置;
插入鼠标经过图像、图像占位符;
将图片和文字进行混合排版;
保存文件,预览文件效果;
插入的图像必须放在站点文件夹下的image文件夹内;
设置图片的热点区域可选任意的工具;
图1-3
实训4表格布局
为了让学生熟练掌握在Dreamweaver中插入表格,学会设置表格的各项属性;
并掌握如何在表格中插入文本、插入图像的操作方法和步骤。
插入表格,并选择表格和单元格:
设置单元格属性:
调整表格结构、大小:
格式化表格:
表格中插入文本,表格中插入图像:
要求学生掌握在Dreamweaver如何插入表格、设置表格和单元格的格式;
如何调整表格的结构大小;
掌握表格中如何插入文字及图像等操作。
新建一个页面,在页面中插入一个6行7列的表格,并在其中输入相应的文字;
选择表格利用“格式化表格”命令来对表格格式进行修改,使其更美观;
根据要求对部分单元格进行拆分或合并操作;
设置文字的对齐方式,通过对边框、填充和间距进行设置;
插入表格时要注意:
单元格的边距和单元格的间距值的设置;
表格边框线精细为0像素的特殊用途;
实训思考
如何折分和合并单元格?
如何设置表格的背景?
书写实训报告要求
根据调试结果,写出调试分析报告
写出本次实训的心得与体会
图1-4
如下图所示的表格布局
图1-5
实训5框架网页
为了让学生掌握如何创建框架;
设定框架的内容和样式;
学会制作浮动的框架等操作。
创建框架
设定框架内容和样式,保存框架
设置无框架内容
制作浮动框架
要求学生能利用框架来进行布局网页,设定框架内容和样式;
设置框架的内容;
制作可以浮动的框架。
在新建文档对话框的“框架集”类型中,选择左侧固定上方嵌套的框架模式,创建一个新的框架页;
插入图片和按钮,以及相关的文字内容;
在属性面板中设置文字和图片的格式属性;
在左侧列出导航链接,制作链接对应的子页面,最终实现点击左侧框架的链接,右面的框架会跳转到相应的子页面;
保存文件,一定要分别保存框架的各个部分,每一部分为一个HTML文件,总的框架是一个HTML文件,预览文件效果;
框架的保存分几个部分;
框架的保存应注意有几个文件要保存?
如何设置框架中的链接?
图1-6
实训6超级链接
为了让学生掌握如何利用超级链接来制作页面;
了解主页的创作步骤;
掌握链接各种方式的制作方法与步骤。
插入横向导航条
设置文本链接
插入左置导航栏
创建外部超级链接
创建内部超级链接
创建E-MAIL链接
创建锚点链接
创建下载文件的链接
创建空链接
创建脚本链接
要求学生能利用链接来制作网页;
掌握链接几种设置的方法和步骤;
制作主页的步骤和要求等内容。
创建一个上方固定左侧嵌套的框架页面;
在框架的上部分插入相关的图片或网站的LOGO及BANNER;
左侧插入相关的文字,作为左侧导航栏,右侧框架页面中输入相关文字;
在右侧框架页面中,分别以3段文本段落标题作为锚点,在页面上部设置锚记链接;
在左下部设置“友谊链接”到相关的网站,设置“联系我们”的E-MAIL链接;
创建“下载”到下载文件的链接;
导航栏要注意分类,避免重复出现;
锚点的名称要注意不能重名。
图1-9
实训7表单网页
为了让学生掌握如何创建表单网页;
了解各个表单对象属性的设置;
熟练掌握各个表单对象不同的使用范围。
插入表单
插入表单对象:
文本框、复选框、单选按钮、按钮、复框框、图像域、密码域、列表和菜单
要求学生能利用表单来创建网页;
掌握设定表单的内容和表单对象;
掌握设置各个表单对象的属性值等内容。
打开02.html页面,按图11所示,分别合并前两行单元格和中间两列单元格,在合并后的单元格内插入一个表单,为插入的表单命名为login;
在表单中插入文字内容及对应的表单对象:
设置各个表单对象的属性值:
将客户姓名、E-MAIL、具体地址的文本域依次命名为name、email、address;
字符宽度和最多字符数分别为12、12,24、24,30和30,类型都为单行文本域;
最后一个文本域输入框命名为jianyi,类型为多行文本域,字符宽度和行数依次为50、8,文本域载入时显示值为“请在此输入你的建议”
设置表单中的客户姓名为必填项,E-MAIL为必填项且必为邮件地址;
设置表单以邮件发送的方式发送到邮箱zzyan@;
在一个网页中只能插入一个表单,但在一个网页中可以有多个表单对象;
各个表单对象注意在属性面板中定义其名称。
表单对象中的插入两个单选按钮,如何命名?
如何设置密码域?
文本字段与文本区域如何转换?
如何设置检查表单的行为?
图1-11
实训8美化网页
为了让学生了解使用CSS样式来美化网页的方法,掌握创建CSS样式的方法和步骤,以及利用CSS滤镜来制作文字特效等操作。
准备制作网页所需的文字素材、图像素材、音乐素材、动画素材。
实训课时:
2学时
CSS样式的新建:
CSS样式的编辑与修改:
CSS样式的应用:
利用CSS滤镜来特效文字效果:
制作光晕字、阴影字、遮罩字、动感字
要求学生掌握CSS样式的制作方法;
掌握CSS样式的应用与修改操作;
了解利用CSS样式来制作文字特效等操作。
打开02.html页面,在此页面中创建CSS样式:
以css-01为名保存,设置字体为隶书,字号为16点数,颜色为#CC66FF,带下划线。
对页面中左、右两部分文字分别设置空链接。
使用CSS样式:
对左边的链接文字套用此样式。
修改CSS样式:
对表格的框线、背景图片、链接样式等进行设置,并重新应用到所指定的部分;
运用CSS滤镜来制作文字特效:
光晕字、阴影字、遮罩字、动感字的制作;
保存页面,预览效果图;
CSS样式应保存到网站站点目录下;
CSS样式的名称应注意不能同名;
图1-13
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 网页 设计 期末 练习 解析