Dreamweaver架设网站终极教程

一 定义站点 1 在任意一个根目录下创建好一个文件夹 我们这里假设为 E 盘 如 取名为 MyWeb 备注 网站中所用的文件都要用英文名 2 打开 Dreamweaver 选择 站点 新建站点 打开对话框 在站点名 称中输入网站的名称 可用中文 在本地根文件夹中选择刚才创建的文件夹 E web 然后确定即可 备注 再次打开 Dreamweaver 会自动找到刚才设立的站点 如果有多 个站点 可以在菜单 站点 打开站点 中去选择 二 创建页面 1 在本地文件夹 E MyWeb 下面的空白处 按右键选 新建文件 这样 就建好了一个页面 默认的文件名为 untitled htm htm 就表示这个网页文件 是一个静态的 HTML 文件 给它改名为 index htm 网站第一页的名字通常是 index htm 或 index html 其它页面的名字 可以自己取 2 双击 index htm 进入该页面的编辑状态 在标题空格里输入网页名称 按右键选页面属性 打开 页面属性 窗口 在这里可以设置网站的标题 背 景颜色或背影图像 超级链接的颜色 一般默认即可 其他都保持默认即可 3 此时光标位于左上角 可输入一句话 如 欢迎来到我的主页 选取 文字 用菜单 窗口 属性 打开属性面板 选取文字大小为 6 再使文字居中 然后在文字前用几个回车使其位于页面中间 4 如要选取字体 则选择字体中的最后一项 编辑字体列表 然后在对话 框中选 号 接着在 可用字体 栏中选择需要加入到字体列表中的一种字体 点击中间的按钮就可以加入了 在网页上最常用的是宋体字 不要将特殊的字体加到列表中使用 因为 别人电脑上未装就看不到 如果需要用的话 要做成图片后再使用 在网页上打入空格的办法是 把输入法调为全角 在网页上换行的办法是 shift Enter 只按 Enter 则为换段 三 为页面添加图片 1 在本地文件夹 E MyWeb 下面的空白处 按右键选 新建文件夹 这 样建立了一个文件夹 用它来放图片 可以改名为 tu 或 pic 或 images 都可以 2 用菜单 窗口 对象 打开对象面板 点击 插入图像 在对话框里 选要插入的图片 如果会出现对话框 你愿意将该文件复制到根文件夹中吗 必须选 是 然后将它保存到刚建好的文件夹里 3 选中该图片 打开属性面板 可以在上面为图片取名 重新设置图片的 高 宽 拖住图片角上的点可以变大小 按住 shift 键 再拖动角上的点 可 以使图片保持宽高比例拉伸 如要恢复这原始大小 则单击右下角的 重设大 小 按钮 4 链接 可以直接在这里输入地址 替代 是图片的说明 即鼠标 指向图片所显示的文字 边框 是图片边框宽度 对齐 是对齐方式 四 添加超级链接 1 为文字添加链接 比如 在页面上输入 我的文章 然后将其选中 打开属性面板 在 链接 一格中 选择它所要链接到的页面即可 后面一格 目标 我们一般 常用的是 self 即打开的新窗口代替了现开的窗口 或是选择 blank 即打开新窗 口 2 为图片添加链接 与上面文字的链接同理 插入图片 然后在属性面板中的链接一格中选择 即可 图片可以创建不同的多个链接 方法如下 在属性面板中的 地图 一项下面有一些图形 比如点击方形 光标变成 十字 在图片上画一个蓝色矩形的热区 此时在属性面板上可以为这个热区设 置链接地址 鼠标指向会显示 同样 再用圆形设置一个热区 就可以再为该 图片设置其他链接了 3 添加 E mail 链接 选中需要添加 E mail 链接的文字或图片 打开属性面板 在 链接 一格 中输入填写邮件地址 格式如下 mailto 邮件地址 注意中间不空格 4 如果链接到浏览器无法打开的文件 例如 exe Zip 等文件 那么浏览 者在点击这个链接的时候 就会实现文件下载 或是在线播放的功能 五 表格的使用 1 点击插入 表格 打开表格面板进行设置 行数 列数 宽度 边框等 单元格填充 为单元格内侧与内容的距离 单元格间距 为单元格之间的 距离 单位均为像素 2 插入表格后 在表格的边框上点击一下 可以全选整个表格 然后在下 面的属性面板里可以进行各种设置 3 把光标移到其中一个单元格 此时看到的属性面板 就是单元格的属性 面板 也可以进行各种关于单元格的操作 如背景色 背景图 边框 合并 拆分等 六 关于表格的其他操作 一制作细线表格 原理 1 选中整个表格 设置其背景为黑色 该颜色即表格线的颜色 2 选中所有单元格 设置其背景为白色 二自动格式化表格 1 先制作好一张表格 然后选中 2 选菜单中的命令 格式化表格 即可以其中选择预设好的一些表格样式 三一像素分割条 1 插入一个 1 行 1 列 宽为 200 像素 边框边距均为 0 的表格 2 选中表格 设置表格高为 1 像素 并设置一个背景色 即所要的线条颜 色 3 切换到代码和设计窗口 将代码 删除 七 用表格构建完整的页面 一网页顶部 一般包括图标 广告 导航菜单 1 创建一个 1 行 2 列 宽为 760 像素 边框及边距均为 0 的表格 2 选中表格 设置排列方式为居中对齐 背景色为 3366CC 3 将光标置于左边单元格中 设置其水平排列为左对齐 垂直排列为顶端 对齐 然后插入一张图像 一般在此插入的是网站的图标 即 logo 4 将光标置于右边单元格中 设置其宽度为 500 水平排列为居中对齐 垂直排列为中间 然后插入图像 一般是网页广告 即 banner 5 将光标置于刚完成的表格之后 插入 表格 创建一个 1 行 1 列 宽为 760 像素 边框及边距均为 0 的表格 6 选中刚创建的表格 设置排列方式为居中对齐 背景色为 005173 7 在该表格中依次插入多个图像 作为导航条菜单 二网页中部 左边栏目列表 中间网站新闻 右边栏目列表 1 在导航条表格后面 插入 表格 创建一个 1 行 3 列 宽为 760 像素 边框及边距均为 0 的表格 并设置排列方式为居中对齐 背景色为 FFFFFFF 2 将光标置于左边单元格中 设置其宽度为 18 水平排列为居中对齐 垂直排列为顶端对齐 然后插入一张图像 插入一个导航条 3 将光标置于刚插入的图片后 插入 表格 插入一个 12 行 1 列 宽为 90 的表格 设置其单元格间距为 1 背景色为 CCCCCC 4 将光标放在表格第一个单元中 设置其高为 20 背景色为 FFFFFF 插入 图像 插入一个导航文字前面的小点 同样设置其他 11 个单元格 这样 左边的栏目分类列表就完成了 5 将光标置于主体表格的中间单元格中 设置其宽度为 66 水平排列 为居中对齐 垂直排列为顶端对齐 然后插入 图像 插入一个导航条 6 将光标置于图像后 插入 表格 插入一个 4 行 1 列 宽为 95 的表格 设置其单元格间距为 1 背景色为 CCCCCC 7 将光标置于表格的第一个单元格中 拖动鼠标 将 4 个单元格都选中 设置高为 60 背景色为 FFFFFF 8 将光标置于主体表格右边的单元格中 设置其宽度为 16 水平排列 为居中对齐 垂直排列为顶端对齐 插入 图像 插入一个导航条 9 将光标置于图像后 插入 表格 插入一个 7 行一列 宽为 90 的表格 设置其间距为 1 背景色为 CCCCCC 10 按住 Ctrl 键 用鼠标点击刚插入的表格的第 1 3 5 7 单元格 然 后设置它们的高为 55 背景色为 FFFFFF 11 选中第 2 4 6 单元格 设置其高为 6 背景色为 FFFFFF 12 切换到源代码窗口 将第 2 4 6 单元格中的空格符号 删除 三网页底部 一般包括版权信息及其他相关内容 1 将光标置于主体表格后 插入 表格 创建一个 2 行 2 列 宽为 760 像 素 边框及边距均为 0 的表格 2 选中表格 设置排列方式为居中对齐 背景色为 3366CC 3 将光标置于表格第 1 行的左边单元格中 设置其宽度为 50 水平排 列为默认 垂直排列为基线 背景色为 FFFFFF 然后输入版权信息 内容颜色 随便 4 将光标置于表格第 1 行右边单元格中 插入 图像 插入一个圆角图像 在它后面输入 Email 字样 设置其大小和颜色为 1 和 FFFFFF 5 插入 表单对象 文本域 插入一个文本域 宽度可以随意 6 插入 图像 插入一个 GO 的图像 7 设置页属性 点击菜单修改 页面属性 在标题一栏中输入标题 并选 择背景图像 将顶部边界设为 0 将整个网页分部分放到不同的表格中组合而成 还可以加快浏览器读取 页面的时间 因为浏览器是读完整个表格后才显示内容的 所以最好不要框 在整个一个表格中 八 用布局表格构建完整的页面 1 单击插入 布局 里面的布局视图按钮 就切换到布局视图状态 默认 为标准视图 也可以用菜单里的查看 表格视图 布局视图来进入 2 先单击绘制布局表格按钮 然后在页面中像绘图一样创建出布局表格 3 就像上一个例子一样 先绘制好网页的顶部 再中部 再底部的大表 格 4 再单击绘制布局单元格按钮 然后在已经绘制好的布局表格中 再绘 制布局单元格 5 返回到标准视图 在已经划分好的表格里 再插入嵌套的小的表格 把页面再细化 就可以完成整个页面的设计了 注意把整个页面都放在一个大的布局表格中 因为这样的网页浏览速 度会很慢 应该按照页面的版面和内容划分出几个布局表格 然后在其中分别 插入布局单元格 九 层的使用 1 点击插入 层 也可以点击图标 然后拖动鼠标创建出一个层 3 选中创建的层 看属性面板 层编号 和 标签 都使用默认即可 层编号 是编程时需要用的 我们现在一般不用 上 即距页面上边界的 距离 左 是距左边界的距离 z 轴 是层的顺序 数字大的叠加在数字 小的上面 如不设置颜色时 层是透明的 4 点中层左上角的小方框可以随意拖动层 大小也可以调节 5 溢出 一栏中 当文字多于层的大小时 visible 超出的部分照样显 示 hidden 超出部分隐藏 scroll 不管有否超出 都显示滚动条 auto 有超出时才出现滚动条 6 点击菜单窗口 其他 层 此时将出现层管理窗口 可以在其中修改层的 名称和 Z 轴值 也可以点击眼睛图标使层可见或不可见 还有一个防止重叠的 选项 7 层的对齐 按住 shift 键 同时选中几个层 然后用修改 对齐 用这 里的选项 8 嵌套层 首先在文档中插入一个层 将光标置于该层内 然后继续 插入一个层 就得到了嵌套层 里面的叫子层 外面的父层 它们的 Z 轴顺 序是一样的 拖动父层时 子层也会相对移动 移动子层时 父层不会随之移 动 十 了解时间轴 1 点击菜单中的插入 层 插入一个层 2 在层中插入图片 如一张飞机的图片 这里的图片也可以是一张小动 画的 gif 图像 3 点击菜单中的窗口 其他 时间轴 打开时间轴窗口 4 选中页面上创建的层 用鼠标按住层左上角的小方框图标 将层拖放到 时间轴的第 1 帧中 这时自动创建了一个长度为 15 帧的时间轴 5 选中时间轴上的第 1 帧 将页面中的层拖放到页左上角 即动画开始时 的位置 6 选中时间轴上第 15 帧 可以拖动该帧至任意长度 如 30 帧 7 选中第 30 帧 将层拖放到页面的右下方 此时窗口中显示出层从第 1 帧到第 30 帧的运动轨迹 此时运动为直线 8 可以点中第 15 帧 右键选 增加关键帧 在选中第 15 帧的状态下 拖动层到页面中下方 9 勾选 自动播放 项 十一 制作滚动公告牌 1 在页面上插入一个层 然后为层设置一个背景 作为公告版的框架 2 然后在创建的层中插入嵌套层 将嵌套层移动到父层的下方 3 在嵌套层中输入文本 并将其居中排列 4 打开时间轴面板 将子层作为对象添加到面板中 5 为子层创建一个向上移动的路径 将其移动到父层的上方 6 拖动最后一关键帧 增长动画时间 然后勾选 自动播放 和 循环 两项 7 选定父层 在其属性面板中将 溢出 属性设置为 hidden 十二 在页面中运用 flash 动画 1 点击插入中的 Flash 按钮 即可为页面插入一个动画 也可以选菜单插 入 媒体 Flash 来完成这一步 2 选中已插入的动画 看属性面板 这里可以设置它的宽 高 也可以通 过拖动来改变大小 3 可以在这里点击 播放 来预览动画 十三 让插入的 flash 动画变透明 1 当网页上已经有背景 或是想要在一张图片上再插入 flash 动画 而 flash 动画本身也有背景色 所以会影响美观 这时我们要把它做成透明动画 2 如在页面上插入一张图像 3 在图像上插入一个层 在层中插入好所需要的 flash 动画 4 选中 flash 动画 在属性面板中点击 参数 按钮 5 在 参数 的左面一格输入 wmode 在右面 值 一格输入 transparent 十四 在页面中播放声音 1 在完成全页面以后 如果要为该页添加背景音乐 注意背景音乐一般是 midi 文件 这样的声音文件十分小 易于快速下载 其他格式不适合作为背 景音乐 2 在页面中所有表格之外 注意此时编辑窗口左下方的标签选择栏中仅 显示这一项 或是在左下角点一下 这样才能保证这个行为是添加在整个页面 上的 点击行为窗口上的 按钮 或用菜单 窗口 行为 打开行为窗口 3 从弹出菜单中选择 播放声音 打开一个对话框 4 在这个对话框里用 浏览 选择要播放的声音 并确定 5 这时行为面板上自动显示了事件为 onload 动作为播放声音 点击这 一行 中间出现一个按钮 点击按钮 可以设置这个声音在什么事件下播放 可以选择 显示事件 IE5 0 6 我们常用的如 Onload 当页面载入时 OnClick 单击鼠标 OnMouseOver 鼠标移到对象上 OnUnload 当关闭页面时 等 7 该行为也可以设置在图片上 文字链接上 在文字链接上播放声音之前 先为文字添加一个空链接 即选中文字 在链接一格里输入一个 符号 十五 弹出窗口 1 首先制作一个准备在小窗口中显示的页面 比如 a htm 由于这个弹 出窗口不能太大 所以内容要少一些 2 打开一个制作好的页面 把光标移到页面中所有我表格以外 点击行为 窗口上的 按钮 从弹出菜单中选择 打开浏览器窗口 一项 3 在对话框中里输入相应的设置 要显示的 URL 即 a htm 窗口宽度和高 度自己定 单位为像素 属性中的各项参数需要就打勾 4 设置完毕后 点 确定 此时行为窗口中将显示打开浏览窗口这个行 为 触发条件为 Onload 如果不是要这项 就自己设置 5 该行为也可以设置在图片上 文字链接上 6 可以用这个方法来表示对浏览者的打开时的欢迎 网站公告 离开时的 告别语等 十六 控制状态栏信息 1 打开页面 选中一张图片 2 点击行为窗口上的 号按钮 选择设置文本 设置状态条文本 3 在对话框里的 消息 一栏里 输入需要显示的话 如对这张图片的介 绍 4 可以设置行为的触发条件为 OnMouseOver 鼠标移到对象上 这样当 鼠标经过这张图片的时候 状态栏将出现相关的信息 5 如果需要鼠标在移开后 这个信息消失 那么再次使用这个行为 在 消息 一栏里什么都不写 然后把触发条件改为 OnMouseOut 鼠标移开 6 同样可以在一段文字上设置该行为 或是设置在整个页面上也可以 十七 弹出信息 1 打开一个制作好的页面 点左下角项 点击行为窗口上的 按钮 从弹出菜单中选择 弹出信息 一项 2 在设置窗口中 消息 一栏里输入想显示的消息即可 3 触发条件设置为 Onload 当页面载入时 就可以用来作为打开页面 的欢迎信息 如设为 OnUnload 当关闭页面时 就可以作为用户关闭页面时送 别信息 4 也可以在某一段文字上设置弹出信息 比如一段文字不愿让人复制 就 选中整段文字 注意此时左下角显示 P 即段落 5 然后同样操作 消息可以输入版权之类的语句 只是设置触发条件为 OnBeforeCopy 按右键时触发 或 OnCopy 按右键选复制时触发 十八 动态图片按钮 1 准备好两张同样大小的图片 常用的方法是如一张为灰度照片 一张为 彩色照片 或一张是按钮凹下的样式 一张是按钮凸起的样式 2 举例 插入一个 3 行 1 列的表格 设置宽度为 180 像素 3 将光标置于第一行 插入一张灰度的图片 4 在属性面板中 链接 一栏里输入需要链接的地址 并给图片加上名称 如 tu1 5 点击行为窗口上的 按钮 从弹出菜单中选择 交换图像 6 此时在 图像 一栏中已显示要交换的图像 然后在 庙宇原始档为 一栏里选择好交换后的那张图 7 下面有两个参数 预先载入图像 和 鼠标滑开时恢复图像 都要 选中 8 同样方法创建另外两个动态按钮 十九 用框架布局页面 框架由两个主要部分组成 框架集和单个框架 1 点击插入中的框架 即显示出已定义的 13 种框架的样式 我们上 中 下结构为例 2 点击 上 中 下 框架结构的图标 此时在页上插入上下两个框架 将整个页面分割成了 3 部分 我们分别在上面输入 上 在中间输入 中 在下面输入 下 3 先保存一下 点击菜单中的文件 保存全部 这时首先保存框架集文件 可以自己修改名字 如 kuangjia htm 然后将分别保存框架集中的其他页面 在保存对应的页面的时候 该部分会以虚线框起来 这样可将上面部分保存为 shang htm 下面部分保存为 xia htm 中间部分保存为 zhong htm 4 至此 我们保存了四个页面 分别是框架集 和组成框架集的上 中 下三个页面 所以 其实这个框架是由四个页面组成的 所以用框架会降低一 点用户浏览的速度 5 点击窗口 其他 框架 打开框架的面板 在这里单击某个框架 即可 选中该框架 当框架被选中时 编辑窗口中对应的框架出现虚线 6 如 选中上面 topframe 此时属性面板上显示的是上面这个框架的属 性 同样选中中间框架和下面框架 也可以分别设置它们的属性 7 在编辑窗口中 将鼠标放在两框架之间的边框上 光标将变成上下箭 头形 此时点击边框 选中的是整个框架集 8 此时属性面板上出现的是整个框架组的属性 可以在此设置框架集是 否有边框 宽度及颜色等 不过最为重要的是可以在这里设置框架集中各个框 架的大小 9 在属性面板的右面的图示上选中上面框架 设置它的行为 80 像素 边 框为 0 10 选中下面框架 设置行高为 30 像素 边框为 0 11 选中中间框架 设置行高为 1 单位为相对 相对的意思是 当前 行相对于其他行所占的比例 设为 1 就是指占据除上和下以后的所有浏览窗口 剩余空间 12 举例 将光标置于上面框架 topFrame 上 右键选页面属性 设置背景 色为 FF6600 然后插入 表格 插入一个 1 行 2 列 边框边距都为 0 的表格 设置第 1 个单元格的宽度为 116 像素 然后插入一张图片 将第 2 个单元格设 置为水平对齐方式为居中 垂直排列方式为底部 然后依次输入 狮子座 魔蝎座 双子座 字样 13 将光标置于中部框架 mainFrame 中 右键选页面属性 设置背景色为 FFFFCC 然后插入一张大图像 14 将光标置于下面框架 bottomFrame 中 右键选页面属性 设置一个背 景图像 15 另外做好三个页面 作为 狮子座 魔蝎座 双子座 所要 链接的页面 16 选中 狮子座 在属性中为它设置好要链接的页面 然后在 目标 里选 mainframe 即该内容在中间那个框架中显示 17 同样设置 魔蝎座 双子座 的链接 二十 跳转菜单 1 点击主菜单中的插入 表单对象 跳转菜单 也可以用插入 表单 中的 跳转菜单图标 来调出跳转菜单设置窗口 2 首先在 文本 一栏里输入 请选择相关网站 字样 然后点击窗口 上的 号按钮 这时菜单里多了一个选项 这个选项没有链接 仅作为跳转 菜单的说明文字 3 在文一栏里输入需要的网站 如 新浪 然后在 选择时 前往 URL 一栏里输入网站链接地址 此时 菜单项一栏 里又多了一个选项 这个选项对应一个网的链接地址 4 使用同样方法 在菜单中添加其他一些选项及对应的链接 还可以用 上 下 的按钮 来调整它们的顺序 5 设置窗口的 菜单之后插入前往按钮 一项先不要选择 选中 更改 URL 后选择第一个项目 一项 这样当使用跳转菜单到某个页面后 如果返回 到跳转菜单页面 此时页面中的跳转菜单默认显示的依旧是第 1 项内容 6 设置完毕后点击 确定 即可 因为跳转菜单是一个表单 所以其实是先插入了表单 红色虚线区域 然后在表单中再插入了下拉菜单 7 想修改选项 可以选中页面上的下拦菜单 此时点击属性面板中的 列表值 即可修改各项内容了 8 当选中跳转菜单时 行为窗口中也出现行为 双击该行为 也可以进 入设置窗口 可以重新对其进行设置 9 如果 菜单项 里的第一项就是链接 而不是上面所说的一句提示的 话 那么就要选中 选项 中的 菜单之后插入前往按钮 添加一个 前往 按钮 二十一 运用插件 Dreamweaver 功能扩展 1 首先下载好需要的插件 此处举例用的是 Animate Browser Window 这是一个动态改变窗口的大小的插件 打开 Dreamweaver Extension Manager 安装下载好的插件 2 启动 Dreamweaver 在做好的页面上 右击左下角 body 然后点击 行为窗口中的 号按钮 在其中选择 Animate Browser Window 然后在 其中做相应的设置 这里设置窗口打开之前高宽均为 0 打开后为填满屏幕 触发条件为 onLoad 二十二 滚动字幕 1 把光标插入点放在需要插入滚动字幕的地方 2 点击插入面板的 标签选择器 3 选择 marquee 标签 点击 插入 按钮 然后关闭 标签选择器 4 转换到代码视图 把光标插入点放在 两个 marquee 标签之间 5 选择 窗口 标签检查器 可以在 标签检查器 中设置标签的 各种用法 6 点击 behavior 设置项右边的下拉箭头 选择滚动字幕内容的运动方式 其中三个选项意思分别是 Alternate 内容在相反两个方向滚来滚去 Scroll 内容向同一个方向滚动 Slide 内容接触到字幕边框就停止滚动 7 direction 属性设置字幕内容的滚动方向 四个选项意思为 down 向 下运动 Left 向左运动 Right 向右运动 Up 向上运动 8 scrollamount 属性设置字幕滚动的速度 一般设为 1 9 scrolldelay 属性设置字幕内容滚动时停顿的时间 单位为毫秒 如果 要让滚动看起来流畅 数值应该尽量小 实例中设置为 1 毫秒 10 width 属性设置滚动字幕的宽度 这个任意 比如设置为 300 11 onMouseOver 事件设置鼠标移动到滚动字幕时的动作 常设置为停止 滚动 onMouseOut 事件设置鼠标离开滚动字幕时的动作 常设置为开始滚动 这个两项不能选 只能手工输入 在 onMouseOver 后面输入 this stop 在 onMouseOut 后面输入 this start 12 style 属性设置字幕内容的样式 实例中设置字幕文字大小 也要手 工输入 font 12px 13 loop 属性设置字幕内容滚动次数 默认值为无限 1 也为无限 14 全部代码 滚动字幕内容 二十三 创建 CSS 样式表 1 在网页上输入一些文字 2 打开 CSS 样式 面板 也可以用 窗口 CSS 样式 打开 3 面板下方有四个按钮 分别是附加样式 新建样式 编辑样式 删除样 式 4 点击 新建样式 打开对话框 输入名称 注意名称前有一个点号 如取名为 zi 中文名不行 类型 创建自定义样式 定义在 仅对该文档 5 此时再打开一个对话框 在左边的分类里选择 类型 然后在右面设 置字体为宋体 大小为 14 像素 颜色任意 然后确定 6 选中页面上的文字 然后点击窗口里的样式 zi 此时这段文字就应用 了 CSS 样式 7 如要对刚才定义的 CSS 样式进行修改 可以点中它 然后点下面的编辑 样式按钮 二十四 创建动态链接样式表 1 点击 新建 CSS 样式 对话框 在 定义在 一栏选择 仅对该文档 在 类型 一栏里选择 使用 CSS 选择器 2 当样式表类型选择 使用 CSS 选择器 时 下拉菜单的名字变成了 选 择器 表示输入内容为 CSS 选择符 单击下拉按钮 可以看到动态链接的 4 种状态 a link 超级链接的正常状态 a visited 访问过的超级链接状态 a hover 光标移至超级链接上时的状态 a active 选中超级链接 的状态 3 接下来对这几种状态分别设定 首先从下拉菜单中选择 a link 点击 确定 按钮后弹出样式表设置窗口 设定该样式无下划线 颜色为 FF6600 橙色 4 用同样方法设定 a visited 设定其为无下划线 颜色为 FFFF00 黄 色 5 接下来设定 a hover 设定其为有划线 颜色为 FF6600 橙色 6 a active 不用设置 它会自动依照 a hover 而定 7 在网页上输入一句话 在属性面板中设定它的链接为 即可 注意 必须按照这样 a link a visited a hover a active 的 顺序来设置 否则不会出现预期的效果 如果我们需要一个页面上有两个或更多的链接效果 可以用以下方法 1 点击新建样式按钮 样式类型选 使用 CSS 选择器 在 选择器 一栏里 直接输入 a link2 link 接着设置 a link2 link 为红色无下划线 2 继续定义下面两个样式 名称都直接输入 分别设定它们为 a link2 visited 紫色无下划线 a link2 hover 蓝色有下划线 3 此时在 CSS 样式 选项下多了一个名称为 link2 的自定义样式 4 在页面中输入一段话 为它添加一个 链接 选中这个链接 然后点击 样式表窗口中的样式 link2 将此样式应用在该链接上 5 同样方法可以制作同一页面上的不同链接格式 为保持一种风格 同一页面上不宜建立过多的链接样式 二十五 外部样式表 在不同的页面中应用相同的样式表 1 新建样式表 取名 然后类型选 创建自定义样式 定义在选 新 建样式表文件 2 确定后 打开保存外部样式表的窗口 然后把它保存到本地站点中即 可 3 此时 可以看到样式表窗口中新增了一个样式表文件 文件的后缀名 为 css 4 如果当前页面中的一个内部样式表要导出为外部样式表文件 以便供 其他页面使用 可以点击样式表窗口右上角的灰色的图标 选 导出样式表 此时可以为样式取名和保存为一个外部文件 5 当其他页面需要使用外部样式表时 可以点样式表窗口中的第一个按 钮 附加样式表 打开窗口 然后选择外部样式表文件 在添加为里选 链 接 确定即可 二十六 其他 CSS CSS 里的背景 是设置文字背景 表格背景图等 CSS 里的区块 是指设置文本的文字间距 对齐方式 下标 上标 排列方式等 CSS 里的盒子 是指设置图片和文本内容之间的空白距离 以及图文 混排的方法 CSS 里的边框 是指设置表格文本区 按钮等的美化 CSS 里的列表 是指设置列表项样式 即那种提纲式的一段话 CSS 里的定位 是指设置页面中图片的相对和绝对定位 CSS 里的扩展 其中的光标 可以设置光标的样式 可以设置为 hand 手型 crosshair 十字型 text I 型 wait 等待型 default 默认型 help 帮助型 还有各种方向的箭头型 CSS 里的扩展 其中的过滤器 可以用来做 CSS 滤镜特效 即用来加 工图片的透明 发光等 但效果不太明显 还是用专门加工图片的软件来完成 比较好 二十七 创建网上相册 1 首先要安装好 FireworksMX 软件 2 加工好所需要放在网上的照片 把它们加工成一样大小 放在一个文 件夹里 3 点击菜单中的命令 创建网站相册 打开设置窗口 4 输入相册标题 副标信息 其他信息 以后也可再修改 源图像 文件夹 选择刚才保存照片的文件夹 5 目标文件夹 单击 浏览 按钮选择当前站点目录 即将照片 全部保存到站点里来 6 缩略图大小 一项 可以根据需要选择 显示文件名称 一项 选中会在生成的相册中显示每个图片的文件名 7 列 一格是每一行显示的图片数 默认为 5 可以自己改动 8 下面两个 格式 一般都选 品质较高 9 选中 为每张图片建立导览页面 一项 确定即可 二十八 定制网页过渡功能 网页过渡是指当浏览者进入或离开网页时 页面呈现的不同的刷新效 果 比如卷动 百叶窗等 网页看起来会更具有动感 不过也要注意适可而止 否则太花哨的变化也容易引起浏览者的反感 步骤 1 打开一个页面 单击菜单中的插入 文件头标签 Meta 会弹出 Meta 对 话框 2 在对话框中的属性选项的下拉列表中选 HTTP equivalent 选项 在值 一格中键入 Page Enter 表示进入网页时有网页过渡效果 3 在内容一格中键入 Revealtrans Duration 4 Transition 2 Duration 4 表示网页过渡效果的延续时间为 4 秒 Transition 表示过渡效果 方式 值为 2 时表示圆形收缩 4 输入完后单击确定 存盘 这样当我们点击一个超链接进入这个页面时 就可以看到效果了 5 另外还有二十多种效供你选择 只要将 Transition 的值改为相应的效 果的代号即可 具体效果和设置如下表所示 效果 Transition 效果 Transition 盒状收缩 0 溶解 12 盒状展开 1 左右向中部收缩 13 圆形收缩 2 中部向左右展开 14 圆形展开 3 上下向中部收缩 15 向上擦除 4 中部向上下展开 16 向下擦除 5 阶梯状向左下展开 17 向左擦除 6 阶梯状向左上展开 18 向右擦除 7 阶梯状向右下展开 19 垂直百叶窗 8 阶梯状向右上展开 20 水平百叶窗 9 随机水平线 21 横向棋盘式 10 随机垂直线 22 纵向棋盘式 11 随机 23 二十九 库的应用 网站中有些内容需要反复使用 比如自己制作的一个网站图标等 此 时将这个组件存为在库里 可以随时调用 1 打开一个页面 选择需要保存的组件 比如一个图标 2 点击菜单窗口 资源 打开资源窗口 然后在其中选最下面一本书样的 按钮 打开库面板 3 点击下面的新建按钮 就将刚才选中的图标保存到库里了 此时还可 以给它取名 4 在一个新页面上要应用库里的内容时 打开库面板 选中需要用的图 标 然后点击下面的 插入 即可 三十 用模板迅速完成站点 首页或内部某一页 1 首先规划好自己想要制作的网站 要把它的各项链接的内容都设计好 如我的网站 首页上的链接有 网页版 动画版 请留言 关于我 联系我 许愿瓶 网页版上的链接有 站长简介 教研论文 课堂寻真 原创课件 心 海撷贝 留影人生