第6章 网页设计基础.ppt
上传人:sy****28 上传时间:2024-09-15 格式:PPT 页数:113 大小:11.1MB 金币:16 举报 版权申诉
预览加载中,请您耐心等待几秒...

第6章 网页设计基础.ppt

第6章网页设计基础.ppt

预览

免费试读已结束,剩余 103 页请下载文档后查看

16 金币

下载此文档

如果您无法下载资料,请参考说明:

1、部分资料下载需要金币,请确保您的账户上有足够的金币

2、已购买过的文档,再次下载不重复扣费

3、资料包下载后请先用软件解压,在使用对应软件打开

第6章网页设计基础DreamweaverCS4本章学习目标6.1网页设计的基本概念6.2Dreamweaver工具的使用6.3站点的发布与管理第六章习题布置理论题:一、单选题1-25(P351)二、多选题1-5(P353)三、填空题1-10(P354)操作题:实验报告9-10本章学习目标本章学习目标6.1网页设计的基本概念6.1.1网页与HTML6.1.1网页与HTMLHTML(HypertextMarkupLanguage)是一种超文本标记语言,用来描述万维网上的超文本文件。HTML的普遍应用就是使用超文本的技术,通过单击鼠标从一个主题跳转到另一个主题,从一个页面跳转到另一个页面,实现与世界各地主机文件的链接。例1:创建一个网页,显示“祝大家新年快乐!”,标题为“新年快乐”。6.1.1网页与HTML(1)HTML的结构和常用标签HTML的结构一般使用以下三对标签来构成。<html></html>标签:文档中的所有文本都包含在其中,表示该文档是用超文本标记语言HTML编写的。<head></head>头部标签:用以说明整个文件的一些公共属性。<body></body>正文标签:标签之间的文本是正文,是在浏览器窗口中要显示的页面内容。(2)HTML文件的编写与保存HTML文件的编写主要有两个途径:作为文本文件通过记事本输入代码,保存时将文件扩展名改写为.html。通过网页制作工具,在代码视图中直接输入代码并保存。常用的网页制作工具有以下几种:Dreamweaver:可视化网页制作工具FrontPage:表单式网页制作工具AdobePagemile:多框架、表单和ImageMap图像的网页制作工具ClarisHomePage:动态网页快速制作工具6.1.2网页设计的流程网页设计的流程主要包括:前期策划创建站点创建主页和其他网页网页设计的版面布局添加网页基本元素创建网页超级链接制作网页表单6.2Dreamweaver工具的使用6.2.1Dreamweaver的界面Dreamweaver的界面Dreamweaver主要包括10项主菜单:Dreamweaver工具栏主要有:(1)“插入”工具栏文档编辑区是编辑和设计网页的主要工作区域属性面板位于操作界面底部,主要用于编辑和查看页面中各对象的属性设置。在默认情况下,属性面板显示的是文本属性。DreamweaverCS4进一步提升了CSS规则在网页设计上的应用,在属性面板里提供了“HTML”和“CSS”两种类型的属性设置。(1)HTML类型:可以进行格式、粗/斜体、项目符号与编号、段落缩排、链接及链接目标等属性设置。这些属性只针对当前所选内容产生效果。(2)CSS类型:属性设置后会自动建立一个CSS样式,以便下次直接套用所见的样式。面板是提供某类功能命令的组合,通过面板可以快速完成目标的相关操作,利用“窗口”菜单下的对应命令可打开或关闭相关的面板。6.2.2站点的新建与管理1.站点的结构6.2.2站点的新建与管理2.站点的建立6.2.2站点的新建与管理3.站点的管理3.站点的管理6.2.3网页元素的添加与处理1.文本操作(3)网页页面属性设置例2:打开wy1.html,将网页标题设置为“母亲河”,设置网页的超级链接颜色。(4)文本属性设置(HTML属性)(7)设置列表例4:将wy1-1.html中的相应段落设置编号列表。在网页中插入图像,可以使网页更加美观,它能装饰网页,表达企业或个人的情趣和风格。例5:将图像huanghe.jpg文件插入到wy1.html文档中,并设置替换文本。例5:将图像huanghe.jpg文件插入到wy1.html文档中,并设置替换文本。(2)图像的属性设置(3)插入鼠标经过图像例6:在wy1.html网页中插入“鼠标经过图像”,图像为huanghe1.jpg和huanghe2.jpg文件。插入“鼠标经过图像”对话框CSS(CascadingStyleSheet)称为“层叠样式表”,简称为“样式表”。CSS是一组格式设置规则,用于控制Web页面元素的外观布局。使用CSS可以灵活并更好地控制许多文本属性,包括特定字体、大小、粗体、斜体、下划线等。(1)CSS规则(2)CSS定义6.2.3网页元素的添加与处理6.2.3网页元素的添加与处理(3)CSS的应用(1)插入Flash动画Flash动画以其文档容量小、效果丰富等特点深受网页制作者的钟爱。插入Flash动画(“插入/媒体/SWF”菜单命令)(2)添加音频(“插入/媒体/插件”)(3)添加视频(“插入/媒体/FLV”)6.2.3网页元素的添加与处理超链接是指页面对象之间的链接关系,只有通过超链接才可以实现在不同网页,乃至不同网站之间的跳转。超链接就是