描述
开 本: 16开纸 张: 胶版纸包 装: 平装-胶订是否套装: 否国际标准书号ISBN: 9787302479376丛书名: 实战从入门到精通(视频教学版)
“实战从入门到精通(视频教学版)”系列图书是专门为网站开发和数据库初学者量身定做的一套学习用书,整套书涵盖网站开发、数据库设计等方面。整套书具有以下特点:
前沿科技
无论是网站建设、数据库设计还是HTML5、CSS3,我们都精选较为前沿或者用户群*的领域推进,帮助大家认识和了解*动态。
作者团队
组织国家重点实验室和资深应用专家联手编著该套图书,融合丰富的教学经验与优秀的管理理念。
学习型案例设计
以技术的实际应用过程为主线,全程采用图解和同步多媒体结合的教学方式,生动、直观、全面地剖析使用过程中的各种应用技能,降低难度,提升学习效率。
本书以零基础讲解为宗旨,用实例引导读者深入学习,采取“精通网页设计技法→精通网页设计艺术→精通网页元素设计技法→精通网页动画设计→综合网站开发实战”的讲解模式,深入浅出地讲解网页设计的各项技术及实战技能。
本书第1篇“精通网页设计技法”主要讲解认识Dreamweaver CC、创建网页中的文本、插入图像与多媒体、设计网页超链接、表格的应用、使用网页表单和行为、使用模板和库等;第2篇“精通网页设计艺术”主要讲解网站配色与布局、使用CSS样式表美化网页、网页布局典型范例等;第3篇“精通网页元素设计技法”主要讲解Photoshop CC基本操作、制作网页文字特效、制作网页按钮与特效框线、制作网页导航条等;第4篇“精通网页动画设计”主要讲解制作简单网页动画、使用时间轴、帧和图层、使用元件和库、制作动态网站Logo与Banner等;第5篇“综合网站开发实战”主要讲解Photoshop CC设计网页、Flash CC设计网页、Dreamweaver CC开发网站留言系统、设计移动设备类型网页、网站的发布等;在DVD光盘中赠送了丰富的资源,诸如本书实例源代码、教学幻灯片、本书精品教学视频、88个实用类网页模板、精选的JavaScript实例、HTML5标签速查手册、CSS属性速查表、JavaScript函数速查手册、CSS DIV布局赏析案例、精彩网站配色方案赏析、网页样式与布局案例赏析、Web前端工程师常见面试题等。
本书适合任何想学习网页设计的人员,无论您是否从事计算机相关行业,是否接触过网页设计,通过学习均可快速掌握网页的设计方法和技巧。
第1篇 精通网页设计技法
第1章
磨刀不误砍柴工——认识Dreamweaver CC
1.1 走进Dreamweaver CC 4
1.1.1 安装Dreamweaver CC 4
1.1.2 启动Dreamweaver CC 5
1.2 Dreamweaver CC的工作环境 6
1.2.1 认识Dreamweaver CC的工作界面 6
1.2.2 熟悉【插入】面板 8
1.3 体验Dreamweaver CC的新增功能 9
1.4 创建站点 12
1.4.1 案例1——创建本地站点 12
1.4.2 案例2——创建远程站点 13
1.5 管理站点 14
1.5.1 案例3——打开站点 14
1.5.2 案例4——编辑站点 14
1.5.3 案例5——删除站点 15
1.5.4 案例6——复制站点 16
1.6 操作站点文件及文件夹 16
1.6.1 案例7——创建文件夹 16
1.6.2 案例8——创建文件 17
1.6.3 案例9——文件或文件夹的移动和复制 17
1.6.4 案例10——删除文件或文件夹 18
1.7 高手解惑 18
1.8 跟我练练手 20
第2章
网页内容之美——创建网页中的文本
2.1 网页设计的基本操作 21
2.1.1 案例1——新建网页 21
2.1.2 案例2——保存网页 21
2.1.3 案例3——打开网页 23
2.1.4 案例4——预览网页 23
2.2 设置页面属性 24
2.3 用文字充实网页 28
2.3.1 案例5——插入文字 28
2.3.2 案例6——设置字体 29
2.3.3 案例7——设置字号 30
2.3.4 案例8——设置字体颜色 31
2.3.5 案例9——设置字体样式 32
2.3.6 案例10——编辑段落 33
2.3.7 案例11——检查拼写 38
2.3.8 案例12——创建项目列表 39
2.4 特殊文本的操作 41
2.4.1 案例13——插入换行符 41
2.4.2 案例14——插入水平线 42
2.4.3 案例15——插入日期 42
2.4.4 案例16——插入特殊字符 43
2.4.5 案例17——插入注释 44
2.5 实战演练——设置主页中的跟踪图像 44
2.6 高手解惑 46
2.7 跟我练练手 46
第3章
有图有真相——使用图像和多媒体
3.1 选择适合网页中图像的格式 48
3.2 用图像美化网页 49
3.2.1 案例1——插入图像 49
3.2.2 案例2——图像属性设置 50
3.2.3 案例3——图像的对齐方式 52
3.2.4 案例4——插入鼠标经过图像 52
3.2.5 案例5——插入图像占位符 54
3.3 在网页中插入多媒体 55
3.3.1 案例6——插入背景音乐 55
3.3.2 案例7——插入Flash动画 56
3.3.3 案例8——插入FLV视频 57
3.3.4 案例9——插入HTML5音频 59
3.3.5 案例10——插入HTML5视频 59
3.4 实战演练——制作图文并茂的网页 61
3.5 高手解惑 62
3.6 跟我练练手 63
第4章
不在网页中迷路——设计网页超链接
4.1 链接与路径 66
4.1.1 链接的概念 66
4.1.2 链接路径 66
4.1.3 链接的类型 67
4.2 添加网页超链接 68
4.2.1 案例1——添加文本链接 68
4.2.2 案例2——添加图像链接 69
4.2.3 案例3——创建外部链接 70
4.2.4 案例4——创建锚记链接 70
4.2.5 案例5——创建图像热点链接 72
4.2.6 案例6——创建电子邮件链接 72
4.2.7 案例7——创建下载文件的链接
73
4.2.8 案例8——创建空链接 74
4.2.9 案例9——创建脚本链接 74
4.3 案例10——链接的检查 75
4.4 实战演练——为企业网站添加友情链接 76
4.5 高手解惑 77
4.6 跟我练练手 77
第5章
简单的网页布局——表格的应用
5.1 插入表格 80
5.2 选择表格 81
5.2.1 案例1——选择完整的表格 81
5.2.2 案例2——选择行和列 82
5.2.3 案例3——选择单元格 82
5.3 表格属性 83
5.3.1 案例4——设置单元格属性 83
5.3.2 案例5——设置整个表格属性 84
5.4 操作表格 84
5.4.1 案例6——调整大小 85
5.4.2 案例7——增加行、列 85
5.4.3 案例8——删除行、列、单元格内容
86
5.4.4 案例9——剪切、复制和粘贴单元格
87
5.4.5 案例10——合并和拆分单元格 87
5.5 操作表格数据 88
5.5.1 案例11——向表格中输入文本 89
5.5.2 案例12——向表格中插入图像 89
5.5.3 案例13——表格数据的排序 89
5.5.4 案例14——导入表格数据 90
5.5.5 案例15——导出表格数据 91
5.6 实战演练——使用表格布局网页 92
5.7 高手解惑 94
5.8 跟我练练手 95
第6章
让网页互动起来——使用网页表单和行为
6.1 认识表单 98
6.2 在网页中插入表单元素 98
6.2.1 案例1——插入表单域 98
6.2.2 案例2——插入文本域 99
6.2.3 案例3——插入密码域 100
6.3 在网页中插入复选框和单选按钮 101
6.3.1 案例4——插入复选框 101
6.3.2 案例5——插入单选按钮 102
6.4 制作网页列表和菜单 102
6.4.1 案例6——插入下拉菜单 103
6.4.2 案例7——插入滚动列表 103
6.5 在网页中插入按钮 104
6.5.1 案例8——插入按钮 104
6.5.2 案例9——插入图像按钮 104
6.6 插入文件上传域 105
6.7 添加网页行为 106
6.7.1 案例10——打开【行为】面板
106
6.7.2 案例11——添加行为 107
6.8 常用行为的应用 107
6.8.1 案例12——交换图像 107
6.8.2 案例13——弹出信息 109
6.8.3 案例14——打开浏览器窗口 110
6.8.4 案例15——检查表单行为 111
6.8.5 案例16——设置状态栏文本 113
6.9 实战演练——使用表单制作留言本 114
6.10 高手解惑 117
6.11 跟我练练手 118
第7章
批量制作风格统一的网页——使用模板和库
7.1 创建模板 120
7.1.1 案例1——在空白文档中创建模板
120
7.1.2 案例2——在【资源】面板中创建模板 120
7.1.3 案例3——从现有文档创建模板
121
7.1.4 案例4——创建可编辑区域 121
7.2 管理模板 123
7.2.1 案例5——从模板中分离 123
7.2.2 案例6——更新模板及基于模板的网页 123
7.3 库概述 124
7.4 库的创建、管理与应用 125
7.4.1 案例7——创建库项目 125
7.4.2 案例8——库项目的应用 126
7.4.3 案例9——编辑库项目 127
7.5 实战演练——创建基于模板的页面 128
7.6 高手解惑 130
7.7 跟我练练手 130
第2篇 精通网页设计艺术
第8章
视觉重要——网站配色与布局
8.1 善用色彩设计网页 134
8.1.1 认识色彩 134
8.1.2 案例1——网页上的色彩处理
135
8.2 网页色彩的搭配 138
8.2.1 案例2——确定网站的主题色
138
8.2.2 案例3——网页色彩搭配原理
139
8.2.3 案例4——网页中色彩的搭配
141
8.2.4 案例5——网页元素的色彩搭配
143
8.2.5 案例6——网页色彩搭配的技巧
144
8.3 布局网站板块结构 146
8.3.1 案例7——“国”字型 146
8.3.2 案例8——标题正文型 146
8.3.3 案例9——左右框架型 146
8.3.4 案例10——上下框架型 147
8.3.5 案例11——综合框架型 147
8.3.6 案例12——封面型 147
8.3.7 案例13——Flash型 147
8.4 网站配色应用案例 148
8.4.1 案例14——网络购物网站色彩应用
148
8.4.2 案例15——游戏网站色彩应用
148
8.4.3 案例16——企业门户网站色彩应用
149
8.4.4 案例17——时政新闻网站色彩应用
152
8.4.5 案例18——影音视频网站色彩应用
152
8.4.6 案例19——电子商务网站色彩应用
153
8.4.7 案例20——娱乐网站色彩应用
154
8.5 实战演练——定位网站页面的框架 154
8.6 高手解惑 156
8.7 跟我练练手 156
第9章
读懂样式表密码——使用CSS 样式表美化网页
9.1 初识CSS 158
9.1.1 CSS概述 158
9.1.2 CSS的作用 158
9.1.3 基本CSS语法 159
9.1.4 案例1——使用Dreamweaver
CC
编写CSS 159
9.2 使用CSS的方法 161
9.2.1 案例2——行内样式 161
9.2.2 案例3——内嵌样式 162
9.2.3 案例4——链接样式 163
9.2.4 案例5——导入样式 164
9.2.5 案例6——优先级问题 165
9.3 使用CSS样式美化网页 167
9.3.1 案例7——使用字体样式美化文字
167
9.3.2 案例8——使用文本样式美化文本
168
9.3.3 案例9——使用背景样式美化背景
169
9.4 实战演练——设定网页中链接样式 171
9.5 高手解惑 174
9.6 跟我练练手 174
第10章
架构师的大比拼——网页布局典型范例
10.1 使用CSS排版 176
10.1.1 案例1——将页面用div分块 176
10.1.2 案例2——设置各块位置 176
10.1.3 案例3——用CSS定位 176
10.2 固定宽度网页剖析与布局 179
10.2.1 案例4——网页单列布局模式
179
10.2.2 案例5——网页1-2-1型布局模式 182
10.3 自动缩放网页1-2-1型布局模式 186
10.3.1 案例6——“1-2-1”等比例变宽布局 186
10.3.2 案例7——“1-2-1”单列变宽布局 186
10.4 实战演练——使用CSS设定网页
布局列的背景色 187
10.5 高手解惑 188
10.6 跟我练练手 189
第3篇 精通网页元素设计技法
第11章
网页元素设计利器——Photoshop CC
11.1 Photoshop CC工作界面 194
11.1.1 案例1——认识菜单栏 194
11.1.2 案例2——认识选项栏 194
11.1.3 案例3——认识工具箱 195
11.1.4 案例4——认识图像窗口 196
11.1.5 案例5——认识面板 197
11.1.6 案例6——认识状态栏 198
11.2 文件的基本操作 199
11.2.1 案例7——新建文件 199
11.2.2 案例8——打开文件 201
11.2.3 案例9——保存文件 202
11.2.4 案例10——置入文件 203
11.3 应用图像辅助工具 204
11.3.1 案例11——使用标尺 204
11.3.2 案例12——使用参考线 205
11.3.3 案例13——使用对齐功能 206
11.4 实战演练——载入预设资源 206
11.5 高手解惑 208
11.6 跟我练练手 208
第12章
网页中的文字设计——制作网页文字特效
12.1 文字的类型 210
12.2 输入文字 210
12.2.1 通过文字工具输入文字 210
12.2.2 通过文字蒙版工具输入文字选区 212
12.2.3 转换点文字和段落文字 213
12.2.4 转换文字排列方向 213
12.3 设置文字格式 214
12.3.1 通过选项栏设置格式 214
12.3.2 通过字符面板设置文字格式 215
12.3.3 通过段落面板设置段落格式 216
12.4 制作常见特效文字 218
12.4.1 制作路径文字 218
12.4.2 制作变形文字 210
12.5 实战演练——为文本添加外部
字体样式 211
12.6 高手解惑 212
12.7 跟我练练手 213
第13章
网页中迷人的蓝海——制作网页按钮与特效边线
13.1 制作按钮 216
13.1.1 案例1——制作普通按钮 216
13.1.2 案例2——制作迷你按钮 218
13.1.3 案例3——制作水晶按钮 230
13.1.4 案例4——制作木纹按钮 235
13.2 制作装饰边线 238
13.2.1 案例5——制作装饰虚线 238
13.2.2 案例6——制作分割线条 240
13.2.3 案例7——制作斜纹区域 240
13.3 高手解惑 241
13.4 跟我练练手 242
第14章
网站中的路标——制作网页导航条
14.1 网页导航条简介 244
14.2 制作网页导航条 244
14.2.1 案例1——制作导航条框架 244
14.2.2 案例2——制作斜纹 245
14.2.3 案例3——制作纵向导航条 246
14.3 高手解惑 248
14.4 跟我练练手 249
第4篇 精通网页动画设计
第15章
让网页活灵活现——制作简单网页动画
15.1 了解Flash CC 254
15.1.1 绘制矢量绘图 254
15.1.2 设计制作动画 254
15.1.3 强大的编程功能 254
15.2 Flash CC的工作界面 255
15.3 Flash CC的基本操作 260
15.3.1 案例1——新建Flash文件 260
15.3.2 案例2——打开Flash文件 261
15.3.3 案例3——保存和关闭Flash文件 262
15.4 使用文本工具 264
15.4.1 案例4——利用文本工具输入文字
264
15.4.2 案例5——设置文本字符属性
264
15.4.3 案例6——设置传统文本的段落属性
265
15.5 变形文本 266
15.6 分离文本 267
15.7 高手解惑 268
15.8 跟我练练手 268
第16章
动画的核心技术——使用时间轴、帧和图层
16.1 制作Flash CC动画基础 270
16.1.1 案例1——动作补间动画的制作
270
16.1.2 案例2——形状补间动画的制作
271
16.2 图层操作基础 273
16.2.1 案例3——创建图层和图层文件夹
273
16.2.2 案例4——编辑图层 275
16.2.3 案例5——设置图层的状态与属性
277
16.3 时间轴与帧 279
16.3.1 案例6——帧的分类 279
16.3.2 案例7——插入帧 280
16.3.3 案例8——帧标签、注释和锚记
281
16.4 对帧进行操作 282
16.4.1 案例9——帧的删除和清除 282
16.4.2 案例10——帧的选取、复制、
粘贴和移动 282
16.4.3 案例11——翻转帧与洋葱皮工具
283
16.5 实战演练——制作数字倒计时动画 284
16.6 高手解惑 286
16.7 跟我练练手 287
第17章
利用元件和库组织动画素材
17.1 创建Flash元件 290
17.1.1 元件概述与分类 290
17.1.2 案例1——创建元件 290
17.1.3 案例2——调用其他文档中的元件
295
17.2 使用实例 296
17.2.1 案例3——为实例另外指定一个元件
296
17.2.2 案例4——改变实例 297
17.3 使用“库”面板 298
17.3.1 认识“库”面板 298
17.3.2 案例5——库的管理与使用 299
17.4 实战演练——制作绚丽网页按钮 301
17.5 高手解惑 306
17.6 跟我练练手 306
第18章
制作动态网站Logo与Banner
18.1 制作滚动文字Logo 308
18.1.1 设置文档属性 308
18.1.2 制作文字元件 308
18.1.3 制作滚动效果 309
18.2 制作产品Banner 311
18.2.1 制作文字动画 311
18.2.2 制作文字遮罩动画 313
18.2.3 制作图片动画 313
18.3 高手解惑 315
18.4 跟我练练手 315
第5篇 综合网站开发实战
第19章
综合案例实战1——Photoshop CC设计网页
19.1 设计网页Logo 320
19.2 设计网页导航栏 323
19.3 设计网页的Banner 323
19.4 设计网页正文部分 327
19.4.1 设计正文导航 327
19.4.2 设计正文内容 329
19.5 设计网页页脚部分 332
19.6 组合在线购物网页 332
19.7 保存网页 334
19.8 对网页进行切片处理 335
第20章
综合案例实战2——制作个人Flash网站
20.1 实例分析 338
20.1.1 背景概述 338
20.1.2 实例简介 338
20.2 主要知识点 338
20.3 具体的设计步骤 339
20.3.1 网站结构规划 339
20.3.2 主场景的设计 339
20.3.3 次场景的设计 342
20.4 高手解惑 346
第21章
开发网站交互留言板系统
21.1 系统的功能分析 348
21.1.1 规划网页结构和功能 348
21.1.2 网页美工设计 348
21.2 数据库设计与连接 349
21.2.1 数据库的设计 349
21.2.2 创建数据库连接 352
21.3 留言板管理系统页面的制作 354
21.3.1 留言板管理系统主页面的制作 354
21.3.2 访问者留言页面的制作 360
21.4 留言板系统后台管理的制作 362
21.4.1 管理员登录页面的制作 362
21.4.2 留言板后台管理主页面的制作 363
21.4.3 删除留言页面 367
第21章
行业综合案例4——制作移动设备类型网页
21.1 网站设计分析 370
21.2 网站结构分析 370
21.3 网站主页面的制作 371
21.4 网站成品预览 372
第23章
让别人浏览我的成果—网站的发布
23.1 上传网站前的准备工作 380
23.1.1 注册域名 380
23.1.2 申请空间 381
23.2 测试网站 382
23.2.1 案例1——测试站点范围的链接
382
23.2.2 案例2——改变站点范围的链接
382
23.2.3 案例3——查找和替换 383
23.2.4 案例4——清理文档 384
23.3 上传网站 384
23.3.1 案例5——使用Dreamweaver
上传网站 385
23.3.2 案例6——使用FTP工具上传网站 386
23.4 高手解惑 388
23.5 跟我练练手 389
前言
“实战从入门到精通(视频教学版)”系列图书是专门为网站开发和数据库初学者量身定做的一套学习用书,整套书涵盖网站开发、数据库设计等方面。整套书具有以下特点:
前沿科技
无论是网站建设、数据库设计还是HTML5、CSS3,我们都精选较为前沿或者用户群的领域推进,帮助大家认识和了解动态。
作者团队
组织国家重点实验室和资深应用专家联手编著该套图书,融合丰富的教学经验与优秀的管理理念。
学习型案例设计
以技术的实际应用过程为主线,全程采用图解和同步多媒体结合的教学方式,生动、直观、全面地剖析使用过程中的各种应用技能,降低难度,提升学习效率。
为什么要写这样一本书
随着网络的发展,很多企事业单位和广大网民对于建立网站的需求越来越强烈,另外对于大中专院校,很多学生需要做网站毕业设计,但是这些读者又不懂网页代码程序,不知道从哪里下手。为此,本书针对这样的零基础的读者,全面带领读者学习网页设计和网站建设的全面知识,读者在网页设计和网站建设中遇到的技术,本书中基本上都有详细讲解。通过本书的实训,读者可以很快地上手设计网页和开发网站,提高职业化能力,从而帮助解决公司需求问题。
本书特色
零基础、入门级的讲解
无论您是否从事计算机相关行业,是否接触过Dreamweaver CC、Photoshop CC和Flash CC网页设计和动态网站开发,都能从本书中找到起点。
超多、实用、专业的范例和项目
本书在编排上紧密结合深入学习Dreamweaver CC、Photoshop CC和Flash CC网页设计和开发网站技术的先后过程,从Dreamweaver CC的基本操作开始,逐步带领大家深入地学习各种应用技巧,侧重实战技能,使用简单易懂的实际案例进行分析和操作指导,让读者读起来简明轻松,操作起来有章可循。
随时检测自己的学习成果
每章首页中,均提供了学习目标,以指导读者重点学习及学后检查。
大部分章节后的“跟我练练手”板块,均根据本章内容精选而成,读者可以随时检测自己的学习成果和实战能力,做到融会贯通。
细致入微、贴心提示
本书在讲解过程中,各章均使用了“注意”“提示”“技巧”等小栏目,使读者在学习过程中更清楚地了解相关操作、理解相关概念,并轻松掌握各种操作技巧。
专业创作团队和技术支持
本书由千谷网络科技实训中心提供技术支持。
您在学习过程中遇到任何问题,可加入QQ群(号码为221376441)进行提问,专家人员会在线答疑。
超值光盘
全程同步教学录像
涵盖本书所有知识点,详细讲解每个实例及项目的过程及技术关键点。能够比看书更轻松地掌握书中所有的Dreamweaver CC、Photoshop CC和Flash CC网页设计和开发网站知识,而且扩展的讲解部分能使您得到比书中更多的收获。
超多容量王牌资源大放送
赠送大量王牌资源,包括本书实例素材文件、教学幻灯片、本书精品教学视频、网页样式与布局案例赏析、Dreamweaver CC快捷键和技巧、HTML标签速查表、精彩网站配色方案赏析、CSS DIV布局赏析案例、Web前端工程师常见面试题等。
读者对象
没有任何Dreamweaver CC、Photoshop CC和Flash CC网页设计基础的初学者。
有一定的Dreamweaver CC、Photoshop CC和Flash CC网页设计和基础,想精通网页设计的人员。
有一定的网页设计基础,没有项目经验的人员。
正在进行毕业设计的学生。
大专院校及培训学校的老师和学生。
创作团队
本书由刘玉红和蒲娟编著,参加编写的人员还有刘玉萍、周佳、付红、李园、郭广新、侯永岗、王攀登、刘海松、孙若淞、王月娇、包慧利、陈伟光、胡同夫、梁云梁和周浩浩。在编写过程中,我们力尽所能地将好的讲解呈现给读者,但也难免有疏漏和不妥之处,敬请读者不吝指正。若您在学习中遇到困难或疑问,或有何建议,可发电子邮件至电子邮箱(地址为[email protected])。
编 者
第9章 读懂样式表密码——使用CSS样式表美化网页
使用CSS技术可以对文档进行精细的页面美化。CSS样式不仅可以对一个页面进行格式化,还可以对多个页面使用相同的样式进行修饰,以达到统一的效果。本章重点讲述CSS样式表的基本概念、调用方法以及美化网页中各个元素的方法和技巧。
本章要点(已掌握的在方框中打钩)
熟悉CSS的概念、作用与语法
掌握使用CSS样式表的方法
掌握使用CSS样式表美化网页的方法
掌握使用CSS设定网页中链接样式的方法
9.1 初识CSS
现在,网页的排版格式越来越复杂,样式也越来越多。有了CSS样式,很多美观的效果都可以实现,应用CSS样式制作出的网页会给人一种条理清晰、格式漂亮、布局统一的感觉,加上多种字体的动态效果,会使网页变得更加生动、有趣。
9.1.1 CSS概述
CSS(Cascading Style
Sheet),称为层叠样式表,也可以称为CSS样式表或样式表,其文件扩展名为.css。CSS是用于增强或控制网页样式,并允许将样式信息与网页内容分离的一种标记性语言。
引用样式表的目的是将“网页结构代码”和“网页样式风格代码”分离开,从而使网页设计者可以对网页布局进行更多的控制。利用样式表,可以将整个站点上所有网页都指向某个CSS文件,设计者只需要修改CSS文件中的某一行,整个网页上对应的样式都会随之发生改变。
9.1.2 CSS的作用
CSS样式可以一次对若干个文档的样式进行控制,当CSS样式更新后,所有应用了该样式的文档都会自动更新。可以说,CSS在现代网页设计中是必不可少的工具之一。
CSS的优越性有以下几点。
1. 分离了格式和结构
HTML并没有严格地控制网页的格式或外观,仅定义了网页的结构和个别要素的功能,其他部分让浏览器自己决定应该让各个要素以何种形式显示。但是,随便地使用HTML样式会导致代码混乱,编码会变得臃肿不堪。
CSS解决了这个问题,它通过将定义结构的部分和定义格式的部分分离,能够对页面的布局施加更多的控制,也就是把CSS代码独立出来,从另一个角度来控制页面外观。
2. 控制页面布局
HTML中的代码能调整字号,表格标签可以生成边距,但是,总体上的控制却很有限,比如它不能精确地生成80像素的高度、不能控制行间距或字间距、不能在屏幕上精确地定位图像的位置,而CSS就可以使这一切都成为可能。
3. 制作出更小、下载更快的网页
CSS只是简单的文本,就像HTML那样,它不需要图像,不需要执行程序,不需要插件,不需要流式。有了CSS之后,以前必须求助于GIF格式的,现在通过CSS就可以实现。此外,使用CSS还可以减少表格标签及其他加大HTML体积的代码,减少图像用量,从而减小文件的大小。
4. 便于维护及更新大量的网页
如果没有CSS,要更新整个站点中所有主体文本的字体,就必须一页一页地修改网页。CSS则是将格式和结构分离,利用样式表可以将站点上所有的网页都指向单一的一个CSS文件,只要修改CSS文件中的某一行,整个站点中的网页就都会随之发生变动。
5. 使浏览器成为更友好的界面
CSS的代码有很好的兼容性,比如丢失了某个插件时不会发生中断,或者使用低版本的浏览器时代码不会出现杂乱无章的情况。只要是可以识别CSS的浏览器,就可以应用CSS。
9.1.3 基本的CSS语法
CSS样式表是由若干条样式规则组成,这些样式规则可以应用到不同的元素或文档来定义它们显示的外观。每一条样式规则由3部分构成,即选择符(selector)、属性(property)和属性值(value),基本格式如下。
selector{property: value}
⑴ selector选择符可以采用多种形式,可以为文档中的HTML标记,如
、
评论
还没有评论。