网页设计与网站建设案例课堂-(第2版)

目 录 第1篇 网站基础入门 第1章 网站建设入门——网页设计与 网站建设基础 3 1.1 认识网页和网站 4 1.1.1 网页 4 1.1.2 网站 4 1.1.3 网站的分类 5 1.2 认识网页的基本组成 6 1.2.1 网址 7 1.2.2 网页标题 7 1.2.3 Logo 7 1.2.4 文本 8 1.2.5 图像 8 1.2.6 导航栏 9 1.2.7 超链接 9 1.2.8 表单 9 1.2.9 动画 10 1.2.10 Banner 10 1.3 认识静态网页与动态网页 11 1.3.1 静态网页 11 1.3.2 动态网页 11 1.4 网站建设的相关概念 12 1.4.1 因特网与万维网 12 1.4.2 浏览器与HTML 12 1.4.3 URL、域名与IP地址 13 1.4.4 上传和下载 14 1.5 疑难解惑 14 第2章 **视觉*重要——网站配色 与布局 15 2.1 善用色彩设计网页 16 2.1.1 认识色彩 16 2.1.2 确定网站的主题色 17 2.1.3 网页中色彩的搭配 19 2.1.4 网页元素的色彩搭配 20 2.1.5 网页色彩搭配的技巧 21 2.2 常见的网站布局结构 23 2.2.1 “国”字型 24 2.2.2 标题正文型 24 2.2.3 左右框架型 24 2.2.4 上下框架型 25 2.2.5 综合框架型 25 2.2.6 封面型 25 2.2.7 Flash型 26 2.3 网站的色彩应用案例 26 2.3.1 案例1——网络购物类网站的 色彩应用 26 2.3.2 案例2——游戏类网站的色彩 应用 27 2.3.3 案例3——企业门户网站的色彩 应用 28 2.3.4 案例4——时政新闻类网站的 色彩应用 28 2.3.5 案例5——影音类网站的色彩 应用 29 2.3.6 案例6——娱乐类网站的色彩 应用 30 2.4 综合案例——定位网站页面的框架 30 2.5 疑难解惑 31 第3章 读懂网页密码——HTML语言 速成 33 3.1 网页的HTML构成 34 3.1.1 文档标记 34 3.1.2 头部标记 35 3.1.3 主体标记 35 3.2 HTML的常用标记 36 3.2.1 标题标记到 36 3.2.2 段落标记 36 3.2.3 换行标记
37 3.2.4 链接标记 38 3.2.5 列表标记 39 3.2.6 图像标记 41 3.2.7 表格标记 44 3.2.8 表单标记 45 3.3 综合案例——制作日程表 46 3.4 疑难解惑 49 第4章 开启网页制作之路——网站建设 基本流程与制作工具 51 4.1 建站方式 52 4.1.1 自助建站 52 4.1.2 智能建站 52 4.1.3 专业设计 53 4.2 建站流程 53 4.2.1 网站规划 53 4.2.2 搜集资料 54 4.2.3 制作网页 54 4.2.4 网站测试 55 4.2.5 申请域名 55 4.2.6 申请空间 55 4.2.7 网站备案 55 4.2.8 发布网页 57 4.2.9 网站推广和维护 57 4.3 制作网页的常用软件 58 4.3.1 案例1——认识网页布局 软件Dreamweaver CC 58 4.3.2 案例2——认识图像处理 软件Photoshop CC 58 4.3.3 案例3——认识动画制作 软件Flash CC 59 4.4 综合案例——网页制作软件间的 相互关系 60 4.5 疑难解惑 61 第2篇 制作静态网页 第5章 磨刀不误砍柴工——使用 DreamweaverCC创建站点 65 5.1 认识Dreamweaver CC 66 5.1.1 启动Dreamweaver CC 66 5.1.2 认识Dreamweaver CC的 工作区 67 5.1.3 体验Dreamweaver CC的新增 功能 69 5.2 创建站点 72 5.2.1 案例1——创建本地站点 72 5.2.2 案例2——创建远程站点 73 5.3 管理站点 74 5.3.1 案例3——打开站点 74 5.3.2 案例4——编辑站点 75 5.3.3 案例5——删除站点 76 5.3.4 案例6——复制站点 76 5.3.5 案例7——导出与导入站点 77 5.4 操作站点文件及文件夹 79 5.4.1 案例8——创建文件夹 79 5.4.2 案例9——创建文件 79 5.4.3 案例10——文件或文件夹的 移动和复制 80 5.4.4 案例11——删除文件或 文件夹 80 5.5 综合案例——创建本地站点 81 5.6 疑难解惑 82 第6章 制作我的**个网页——使用文本 丰富网页内容 83 6.1 网页文档的基本操作 84 6.1.1 案例1——创建网页 84 6.1.2 案例2——页面属性 84 6.1.3 案例3——保存网页 87 6.1.4 案例4——打开网页 87 6.1.5 案例5——预览网页 88 6.2 使用文字添加网页内容 89 6.2.1 案例6——插入文字 89 6.2.2 案例7——设置字体 90 6.2.3 案例8——设置字号 90 6.2.4 案例9——设置字体颜色 91 6.2.5 案例10——设置字体样式 92 6.2.6 案例11——编辑段落 94 6.2.7 案例12——创建项目列表 99 6.3 使用特殊文本添加网页内容 101 6.3.1 案例13——插入换行符 101 6.3.2 案例14——插入水平线 102 6.3.3 案例15——插入日期 102 6.3.4 案例16——插入特殊字符 103 6.4 综合案例——制作图文并茂的网页 104 6.5 疑难解惑 107 第7章 有图有真相——使用图像与 多媒体网页元素 109 7.1 常用图像格式 110 7.1.1 GIF格式 110 7.1.2 JPEG格式 110 7.1.3 PNG格式 111 7.2 用图像美化网页 111 7.2.1 案例1——插入图像 111 7.2.2 案例2——设置图像的属性 113 7.2.3 案例3——设置图像对齐 方式 115 7.2.4 案例4——剪裁需要的图像 116 7.2.5 案例5——调整图像的亮度 与对比度 117 7.2.6 案例6——设置图像的锐化 效果 118 7.3 插入其他图像元素 119 7.3.1 案例7——插入鼠标经过 图像 119 7.3.2 案例8——插入图像占位符 121 7.3.3 案例9——插入图像热点 区域 122 7.4 在网页中插入多媒体 123 7.4.1 案例10——插入背景音乐 123 7.4.2 案例11——插入Flash动画 124 7.4.3 案例12——插入FLV视频 125 7.4.4 案例13——插入HTML 5 音频 127 7.4.5 案例14——插入HTML 5 视频 129 7.5 综合案例1——制作精彩的多媒体 网页 130 7.6 综合案例2——在代码中插入背景 音乐 132 7.7 疑难解惑 134 第8章 不在网页中迷路——设计网页中 的超链接 135 8.1 超级链接 136 8.1.1 链接的概念 136 8.1.2 常规的链接 136 8.1.3 链接的类型 137 8.2 链接路径 138 8.2.1 什么是URL 138 8.2.2 绝对路径 138 8.2.3 相对路径 139 8.2.4 根相对路径 139 8.3 创建超级链接的方法 139 8.3.1 案例1——使用菜单命令创建 链接 139 8.3.2 案例2——使用【属性】面板 创建链接 140 8.3.3 案例3——使用【指向文件】 按钮创建链接 140 8.4 创建不同种类的网页超链接 141 8.4.1 案例4——添加文本链接 141 8.4.2 案例5——添加图像链接 142 8.4.3 案例6——创建外部链接 143 8.4.4 案例7——创建锚记链接 143 8.4.5 案例8——创建图像热点 链接 145 8.4.6 案例9——创建电子邮件 链接 146 8.4.7 案例10——创建下载文件的 链接 147 8.4.8 案例11——创建空链接 148 8.4.9 案例12——创建脚本链接 148 8.5 综合案例——为企业网站添加友情 链接 149 8.6 疑难解惑 150 第9章 让网页互动起来——使用网页 表单和行为 151 9.1 认识表单 152 9.1.1 什么是表单 152 9.1.2 认识表单对象 152 9.1.3 案例1——插入表单 155 9.1.4 案例2——设置表单属性 156 9.2 常用表单对象的应用 157 9.2.1 案例3——插入文本域 157 9.2.2 案例4——插入密码域 158 9.2.3 案例5——插入复选框 159 9.2.4 案例6——插入单选按钮 160 9.2.5 案例7——插入下拉菜单 160 9.2.6 案例8——插入滚动列表 161 9.2.7 案例9——插入按钮 162 9.2.8 案例10——插入图像按钮 162 9.2.9 案例11——插入文件上传域 163 9.3 认识行为 164 9.3.1 行为的概念 164 9.3.2 案例12——打开【行为】 面板 164 9.4 常用内置行为的应用 165 9.4.1 案例13——交换图像 165 9.4.2 案例14——弹出信息 167 9.4.3 案例15——打开浏览器窗口 168 9.4.4 案例16——检查表单行为 170 9.4.5 案例17——设置状态栏文本 171 9.5 综合案例——使用表单制作留言本 173 9.6 疑难解惑 176 第3篇 网页美化布局 第10章 简单的网页布局——使用表格 布局网页 179 10.1 案例1——插入表格 180 10.2 选中表格 181 10.2.1 案例2——选中完整的表格 181 10.2.2 案例3——选中行和列 182 10.2.3 案例4——选中单元格 183 10.3 表格属性 183 10.3.1 案例5——设置单元格属性 184 10.3.2 案例6——设置整个表格 属性 185 10.4 操作表格 185 10.4.1 案例7——调整表格的大小 185 10.4.2 案例8——增加行和列 186 10.4.3 案例9——删除行、列、 单元格 187 10.4.4 案例10——剪切、复制和粘贴 单元格 188 10.4.5 案例11——合并和拆分 单元格 189 10.5 操作表格数据 190 10.5.1 案例12——在表格中输入 文本 190 10.5.2 案例13——在表格中插入 图像 191 10.5.3 案例14——表格中的数据 排序 191 10.5.4 案例15——导入Excel表格 数据 192 10.6 综合案例——使用表格布局网页 193 10.7 疑难解惑 196 第11章 读懂样式表密码——使用CSS 层叠样式表 197 11.1 初识CSS样式表 198 11.1.1 什么是CSS 198 11.1.2 CSS的3种类型 198 11.1.3 CSS的语法格式 199 11.1.4 案例1——使用Dreamweaver 编写CSS 200 11.2 CSS的使用方式 201 11.2.1 案例2——行内样式 201 11.2.2 案例3——内嵌样式 202 11.2.3 案例4——链接样式 203 11.2.4 案例5——导入样式 204 11.3 CSS中的常用样式 205 11.3.1 案例6——使用字体样式 206 11.3.2 案例7——使用文本样式 210 11.3.3 案例8——使用背景样式 214 11.3.4 案例9——设计边框样式 221 11.3.5 案例10——设置列表样式 225 11.4 综合案例——制作简单公司主页 229 11.5 疑难解惑 232 第12章 架构师的大比拼——利用CSS Div布局网页 233 12.1 认识并创建层 234 12.1.1 什么是层 234 12.1.2 案例1——使用Dreamweaver 创建层 234 12.2 Div层的定位方法 235 12.2.1 盒子模型的概念 235 12.2.2 案例2——定义网页border 区域 236 12.2.3 案例3——定义网页padding 区域 237 12.2.4 案例4——定义网页margin 区域 239 12.3 使用CSS排版 242 12.3.1 案例5——将页面用DIV 分块 242 12.3.2 案例6——设置各块位置 243 12.3.3 案例7——用CSS定位 243 12.4 常见网页布局模式 246 12.4.1 案例8——网页单列布局 模式 246 12.4.2 案例9——网页1-2-1型布局 模式 250 12.4.3 案例10——网页1-3-1型布局 模式 253 12.5 综合案例——创建左右布局页面 257 12.6 疑难解惑 260 第4篇 设计网页元素 第13章 网页图像说变就变——调整 与修饰图像 263 13.1 图像色调的调整 264 13.1.1 案例1——调整图像的亮度 与对比度 264 13.1.2 案例2——使用【色阶】命令 调整图像 264 13.1.3 案例3——使用【曲线】命令 调整图像 268 13.1.4 案例4——调整图像的 曝光度 271 13.2 图像色彩的调整 272 13.2.1 案例5——使用【色相/饱和度】 命令 272 13.2.2 案例6——使用【自然饱和度】 命令 274 13.2.3 案例7——使用【色彩平衡】 命令 274 13.2.4 案例8——使用【黑白】 命令 275 13.2.5 案例9——使用【照片滤镜】 命令 276 13.2.6 案例10——使用【通道混合器】 命令 277 13.2.7 案例11——使用【匹配颜色】 命令 278 13.2.8 案例12——使用【替换颜色】 命令 280 13.2.9 案例13——使用【可选颜色】 命令 282 13.2.10 案例14——使用【阴影/高光】 命令 283 13.3 修复图像中的污点与瑕疵 284 13.3.1 案例15——修复图像中的 污点 284 13.3.2 案例16——修复图像中的 瑕疵 285 13.3.3 案例17——修复图像选中的 区域 286 13.3.4 案例18——内容感知移动 工具 286 13.3.5 案例19——消除照片中的 红眼 287 13.4 通过图像或图案修饰图像 288 13.4.1 案例20——通过复制图像修饰 图像 288 13.4.2 案例21——通过图案修饰 图像 289 13.5 通过橡皮擦修饰图像 290 13.5.1 案例22——擦除图像中指定的 区域 290 13.5.2 案例23——擦除图像中的指定 颜色 290 13.5.3 案例24——擦除图像中相近的 颜色 291 13.6 修饰图像中的细节 292 13.6.1 案例25——修饰图像中生硬的 边缘 292 13.6.2 案例26——提高图像的 清晰度 293 13.6.3 案例27——通过涂抹修饰 图像 293 13.7 通过调色修饰图像 294 13.7.1 案例28——减淡工具和加深 工具 294 13.7.2 案例29——改变图像色彩的 饱和度 295 13.8 综合案例——制作放射线背景图 295 13.9 疑难解惑 296 第14章 网页中的路标与导航——制作 网页按钮与导航条 297 14.1 按钮与导航条的设计原则 298 14.1.1 网页按钮的设计注意事项 298 14.1.2 网页导航条的设计注意 事项 298 14.2 制作按钮 299 14.2.1 案例1——制作普通按钮 299 14.2.2 案例2——制作迷你按钮 301 14.2.3 案例3——制作水晶按钮 303 14.2.4 案例4——制作木纹按钮 307 14.3 制作导航条 310 14.3.1 案例5——制作横向导航条 310 14.3.2 案例6——制作垂直导航条 313 14.4 综合案例——制作水晶风格网站 导航条 314 14.5 疑难解惑 320 第15章 网页中迷人的蓝海——制作 网页特效边线与背景 321 15.1 制作装饰边线 322 15.1.1 案例1——制作装饰虚线 322 15.1.2 案例2——制作内嵌线条 324 15.1.3 案例3——制作斜纹线条 325 15.2 制作网页背景图片 327 15.2.1 案例4——制作渐变背景 图片 327 15.2.2 案例5——制作透明背景 图像 330 15.3 综合案例——制作梦幻星光网页 背景 331 15.4 疑难解惑 336 第16章 网页中的标志与旗帜——制作 网页Logo与网页Banner 337 16.1 网页Logo与Banner概述 338 16.1.1 网页Logo设计标准 338 16.1.2 网页Logo的标准尺寸 339 16.1.3 网页Logo的一般形式 340 16.1.4 网页Banner的标准尺寸 341 16.1.5 Banner设计的注意要点 341 16.2 制作文字Logo 341 16.2.1 案例1——制作背景 341 16.2.2 案例2——制作文字内容 342 16.2.3 案例3——绘制自定义形状 343 16.2.4 案例4——美化文字Logo 344 16.3 制作图案Logo 346 16.3.1 案例5——制作背景 346 16.3.2 案例6——制作图案效果 348 16.4 制作英文Banner 350 16.4.1 案例7——制作Banner 背景 350 16.4.2 案例8——制作Banner 底纹 351 16.4.3 案例9——制作文字特效 352 16.5 制作中文Banner 353 16.5.1 案例10——输入特效文字 353 16.5.2 案例11——将输入的文字设置 为3D效果 354 16.5.3 案例12——制作Banner 背景 356 16.6 综合案例1——制作图文结合 Logo 357 16.7 综合案例2——制作图文结合 Banner 360 16.8 疑难解惑 362 第17章 让网页活灵活现——制作简单 网页动画元素 363 17.1 Flash的基本功能 364 17.1.1 矢量绘图 364 17.1.2 动画设计 364 17.1.3 强大的编程功能 364 17.2 时间轴、帧和图层 365 17.2.1 什么是图层 365 17.2.2 时间轴与帧 365 17.3 制作简单动画 367 17.3.1 案例1——制作帧帧动画 367 17.3.2 案例2——制作补间动画 369 17.3.3 案例3——制作遮罩动画 373 17.3.4 案例4——使用动画预设 375 17.4 综合案例——制作数字倒计时动画 377 17.5 疑难解惑 379 第18章 网页元素的动态交互——创建 交互式动画 381 18.1 ActionScript概述 382 18.1.1 ActionScript基本术语 382 18.1.2 【动作】面板 383 18.2 使用ActionScript制作动画特效 384 18.2.1 案例1——制作按钮切换图片 效果 384 18.2.2 案例2——制作按钮切换背景 颜色效果 389 18.2.3 案例3——制作星光闪烁 效果 394 18.3 Flash常用组件的使用 399 18.3.1 案例4——组件的添加与 删除 399 18.3.2 案例5——Button按钮组件 400 18.3.3 案例6——CheckBox复选框 组件 401 18.3.4 案例7——ComboBox下拉 列表组件 403 18.3.5 案例8——List平铺滚动 组件 405 18.3.6 案例9——RadioButton单选 按钮组件 406 18.3.7 案例10——ProgressBar加载 进度组件 408 18.3.8 案例11——ScrollPane滚动条 窗口组件 409 18.4 综合案例——制作飘雪效果 411 18.5 疑难解惑 414 第19章 让网页动起来——制作动态 网站的Logo与Banner 415 19.1 制作滚动文字Logo 416 19.1.1 设置文档属性 416 19.1.2 制作文字元件 417 19.1.3 制作滚动效果 417 19.2 制作产品的Banner 419 19.2.1 制作文字动画 419 19.2.2 制作文字遮罩动画 421 19.2.3 制作图片动画 422 19.3 疑难解惑 424