DREAMWEAVER+CS4+网页设计与制作指南_第3章.ppt

第3章 制作简单网页 本章重点介绍如何使用dreamweaver cs4快速建立站 点，在站点中新建网页，并学会在网页中进行文本、图像的 处理。本章重点： l 创建站点 l 新建页面 l 设置文件头 l 设置网页文本 l 使用图像 3.1 创建站点 在制作网站时首先要做的就是创建站点，创建本地或远 程站点，为站点内的所有文件建立联系，dreamweaver cs4的“管理站点”还能为创建的站点进行修改、删除、复制 等操作。 3.1.1 新建站点 创建站点从路径上考虑可分为两种，一种是创建本地站 点，另一种是创建远程站点。 l创建本地站点 l创建远程站点 3.1.2 修改站点 选择菜单命令“站点”“管理站点”，打开“管理站点”对话 框，单击右侧的“编辑”按钮，可以对现有的的站点进行编辑 。 3.1.3 多站点管理 在同时存在多个站点的情况下，单击“管理站点”对话框 左侧列表中的站点名称，然后单击“完成”按钮，即切换到此 站点。 3.1.4 创建站点目录结构 创建完站点以后，还要为这个站点添加文件和文件夹， 形成完整的目录结构，这跟windows的资源管理器基本的原 理是一致的，有了清晰的目录结构，也能使设计者的思路清 楚，在确定网站的内容的同时明确网站的目录结构。 3.2 新建页面 上一节学习了如何创建站点，本节重点介绍如何新建页 面。自dreamweaver cs3版本推出以来，到dreamweaver cs4版本，让设计者在新建页面的时候有了更多的可选性， 并有各种已有的样例模板库可供选择。 3.2.1 新建页面 启动dreamweaver cs4，单击菜单命令“文件”“新建” ，弹出“新建文档”对话框，在对话框中有5个选项卡：空白页 、空模板、模板中的页、示例中的页、其他。 3.2.2 保存页面 选择菜单命令“文件”“保存”，弹出“另存为”对话框，输 入文件名为“index.html”，单击“保存”按钮，将新建的页面保 存到站点根目录下。 3.2.3 关闭页面 l选择菜单命令“文件”“关闭”，或按ctrl+w键，将当前 页面关闭。 l选择菜单命令“文件”“全部关闭”，或按ctrl+shift+w键 ，将关闭当前窗口打开的所有文档。 3.3 设置网页文本 文本是网页的重要组成要素，制作网页设计的时候，光 有合理的布局、精细的图片设计也还是不够的，网页文字的 排版也将直接决定网页的视觉效果。网页文本的排版取决于 行距、字距、字数、字体大小等几个要素。 3.3.1 输入文本 文本在网页中占有重要的位置，文本的录入可以通过直 接录入或复制粘贴外部内容完成。 3.3.2 设置标题文本 网页中可以使用默认样式对页面中的文本进行设置，如 标题文本的设置。 3.3.3 设置段落文本 网页文本内容较多时，需要对页面的文本进行段落样式 的设置，用来控制全局的文本显示效果。 3.3.4 设置预先格式化的文本 根据软件中自带的格式化样式，可以对文本进行预先的 格式化设置。 3.3.5 设置文本样式 根据网页的设计效果图，对网页中的文本进行相应的样 式设计。 3.3.6 设置文本对齐方式 网页中的文本，有的时候需要根据设计效果对文本进行 对齐设置。 3.3.7 设置文本凸出/缩进 选定文本，用“属性”面板中的“文本凸出”按钮和“文本缩 进”按钮，可以对文本进行整段的文本缩进设置。 3.3.8 创建列表/编号列表 文本中使用列表或编号可以使用默认样式，也可以自定 义项目符号等。 3.3.9 设置首行缩进 在网页中，根据中英文的文本以及不同人群的阅读习惯 ，对文本进行首先缩进的设置。 3.4 图像处理 图像是网页最主要的元素之一，也是不可或缺的元素， 合理地在网页中使用图像，不仅能美化网页，还能清楚表达 作者的意图，更能比文字更直观地说明问题。通常在设计中 ，如需用到特殊的字体，一般都将文本转化为图像后实现。 ljpeg格式 lgif格式 lpng格式 3.4.1 插入图像 在网页中，图像与文本进行结合，才能让界面更为生动 和富有灵性，在文档中插入图像有两种方法。 3.4.2 设置图像为背景 选择合适的网页背景可以让网页在外观上增色不少。网 页的背景可以使用背景色或背景图像，而单一的颜色作为背 景色可能会让页面在视觉上显得单调，如果选择整个图片作 为背景又因为图像本身的大小造成网页过大，加载时间长而 影响网页的浏览速度。一般在选择背景图像时多选择一幅可 以拼接的小图片，然后平铺，形成一个具体整体风格的网页 背景。 3.4.3 设置跟踪图像 跟踪图像在许多设计者中都没有使用，可能有些人觉得 没有用，因为跟踪图像只是在dreamweaver文档窗口中显示 ，而在浏览器中用户是看不到的。其实这是网页制作中经常 使用的一种辅助工具，也是dreamweaver cs4比较人性化 的一面。 3.4.4 插入翻转图像 在网页图片中，经常可以遇到当鼠标移到某个图像上或 点击时，图像变成另外一幅图像的情况。这可以使图片更能 吸引浏览者的关注。 3.4.5 图像属性设置 图像作为网页的基本构成要素之一，相关的属性设置也 很重要，如图像名称、大小、边框、边距、链接等。 3.5 本章小结 本章详细介绍了创建站点、新建网页，以及如何设置文 件头，并进一步为创建的空白进行文