本书以HTML语言为基础,围绕最新的CSS技术精髓展开深入讲解,主要内容包括认识网站开发、网页文字和图片、超连结、表格、多媒体、滚动字幕、列表、表单、框架、设定文本样式、设定网页背景样式、设定框线和边距样式、设定表格和列表样式、控制元素布局、网页布局与设计技巧等。 本书结构合理、条理清晰、实用性强,从第2章开始,每一个技术的讲解都附有具体的实例,可供读者实际操作使用。,每章都附有习题和上机指导,供课后练习和上机实验。 本书可以作为高等院校计算机科学与技术、软体工程、网路工程、计算机套用等相关专业“网页设计”课程的教材,也可供从事网页设计与製作人员自学参考。
基本介绍
- 中文名HTML+CSS+DIV网页设计与布局
- 作者聂斌
- 日期2013年10月
- 页数318
目录
第一篇 认识网站和网页
第1章 认识网站开发 2
1.1 认识网站开发 2
1.1.1 网页设计概述 2
1.1.2 网页构成元素 2
1.1.3 网站建设流程 3
1.1.4 网站开发软体 4
1.2 HTML基本概念 5
1.2.1 HTML简介 6
1.2.2 HTML基本结构 6
1.3 一个简单的HTML实例 6
1.3.1 编写HTML代码 6
1.3.2 运行HTML档案查看效果 8
1.4 HTML基本标记 8
1.4.1 档案类型标记 8
1.4.2 HTML头标记 9
1.4.3 HTML主体标记 9
1.4.4 页面标题 9
1.5 小结 10
本章习题 10
第二篇 HTML学习篇
第2章 网页文字和图片 12
2.1 文字格式 12
2.1.1 设定文字大小 12
2.1.2 设定字型 13
2.1.3 设定字型颜色 15
2.1.4 加粗与斜体 18
2.1.5 下划线与删除线 19
2.1.6 上标与下标 20
2.1.7 等宽字 21
2.2 与文字排版相关的元素 21
2.2.1 文本缩进 21
2.2.2 换行 22
2.2.3 段落 23
2.2.4 段落居中 23
2.2.5 预定义格式 24
2.2.6 水平分隔线 25
2.3 文字闪烁 26
2.4 设定网页背景颜色 27
2.5 在网页中插入图像 28
2.6 设定背景图片 29
2.7 小结 30
本章习题 30
上机指导 31
实验一练习使用FONT元素来设定文字的大小、颜色和字型 31
实验二练习使用与文字排版相关的元素来设定文字的段落的样式 31
实验三练习使用BACKGROUND属性来设定网页的背景图片 32
第3章 超连结 34
3.1 创建超连结 34
3.1.1 超连结标记 34
3.1.2 连结地址 35
3.1.3 打开连结的方式 37
3.2 锚点 37
3.2.1 创建锚点 38
3.2.2 连结到本页锚点 38
3.2.3 连结到其他网页的锚点 39
3.3 图像的超连结 40
3.3.1 将整个图像设为超连结 40
3.3.2 设定图像热点区域 41
3.4 小结 43
本章习题 43
上机指导 44
实验一练习使用A标记创建一个以新视窗打开的超连结 44
实验二练习使用A标记创建一个连结到其他网页的锚点连结 44
实验三练习使用A标记设定一个矩形的图像热点区域 46
第4章 表格 47
4.1 创建表格 47
4.2 表格属性 48
4.2.1 表格宽度 48
4.2.2 表格高度 49
4.2.3 表格背景图片 51
4.2.4 单元格间距 52
4.2.5 表格内单元格与文字的距离 54
4.3 表格框线 55
4.3.1 框线宽度 55
4.3.2 框线颜色 57
4.3.3 亮框线颜色 58
4.3.4 暗框线颜色 58
4.4 设定表格行的对齐方式 59
4.4.1 垂直对齐方式 59
4.4.2 水平对齐方式 60
4.5 行和列的合併 61
4.5.1 列的合併 62
4.5.2 行的合併 63
4.6 表格结构 64
4.6.1 表头 64
4.6.2 主体 65
4.6.3 表尾 66
4.7 表格标题 68
4.8 表格嵌套 69
4.9 小结 70
本章习题 71
上机指导 72
实验一练习使用TABLE元素创建一个表格 72
实验二练习使用TABLE元素中的各种属性创建一个课程表 73
实验三练习使用TABLE元素创建嵌套表格 74
第5章 多媒体、滚动字幕和列表 76
5.1 多媒体元素 76
5.1.1 插入多媒体元素 76
5.1.2 循环播放 77
5.1.3 自动播放 77
5.1.4 隐藏多媒体元素 78
5.2 插入背景音乐 80
5.3 滚动字幕 80
5.3.1 添加滚动字幕 81
5.3.2 滚动方向 81
5.3.3 滚动方式 82
5.3.4 滚动字幕背景颜色 83
5.3.5 滚动速度 84
5.3.6 滚动延迟 84
5.3.7 滚动次数 86
5.3.8 滚动字幕空白空间 86
5.3.9 设定滑鼠经过效果 87
5.4 无序列表 88
5.4.1 无序列表结构 88
5.4.2 无序列表的列表项样式 89
5.5 有序列表 90
5.5.1 有序列表结构 91
5.5.2 有序列表的列表项样式 92
5.6 嵌套列表 93
5.7 定义列表 94
5.8 目录列表 96
5.9 选单列表 96
5.10 小结 98
本章习题 98
上机指导 99
实验一练习使用EMBED元素插入一个多媒体元素 99
实验二练习使用MARQUEE元素添加一个滚动字幕 100
实验三练习使用UL元素和OL元素创建一个嵌套列表 100
第6章 表单 102
6.1 添加表单 102
6.1.1 连结跳转 102
6.1.2 连结跳转方式 103
6.1.3 表单名称 103
6.2 输入标籤 104
6.2.1 文本框 104
6.2.2 密码框 105
6.2.3 单选框 105
6.2.4 複选框 107
6.2.5 提交按钮 107
6.2.6 重置按钮 108
6.2.7 图像按钮 109
6.2.8 档案域 110
6.2.9 隐藏域 111
6.3 下拉列表 112
6.4 文本域 113
6.5 小结 114
本章习题 114
上机指导 115
实验一练习使用FORM元素插入一个表单 115
实验二练习在表单元素中添加不同的表单控制项 116
实验三练习使用在表单元素中添加下拉列表 117
第7章 框架 118
7.1 创建框架 118
7.2 分割视窗 118
7.2.1 上下分割 118
7.2.2 左右分割 121
7.2.3 视窗的嵌套 122
7.3 设定框架框线 123
7.3.1 设定框架框线显示或隐藏 123
7.3.2 设定框架框线宽度 124
7.3.3 设定框架框线颜色 125
7.4 框架属性 126
7.4.1 设定框架滚动条显示 126
7.4.2 固定框架 126
7.4.3 不支持框架标记 128
7.5 在框架中使用连结 128
7.6 浮动框架 132
7.6.1 插入浮动框架 132
7.6.2 浮动框架大小 133
7.6.3 浮动框架对齐方式 133
7.6.4 浮动框架页面的连结 134
7.7 小结 135
本章习题 136
上机指导 137
实验一练习使用FRAMESET元素创建一个框架 137
实验二练习使用FRAMESET元素创建一个嵌套框架 138
实验三练习使用IFRAME元素创建一个浮动框架 138
第三篇 CCS学习篇
第8章 认识CSS 141
8.1 CSS简介 141
8.2 CSS样式表的设定方法 141
8.2.1 内联样式表 141
8.2.2 内部样式表 142
8.2.3 外部样式表 143
8.2.4 引用多个样式表 144
8.2.5 使用@import引用外部样式表 145
8.2.6 CSS注释 146
8.3 选择符 147
8.3.1 类型选择符 147
8.3.2 类选择符 148
8.3.3 ID选择符 151
8.3.4 包含选择符 152
8.3.5 选择符分组 156
8.3.6 通用选择符 157
8.3.7 子选择符 159
8.3.8 相邻选择符 161
8.3.9 属性选择符 162
8.4 伪类和伪元素 166
8.4.1 超连结的伪类 167
8.4.2 伪元素 168
8.5 CSS优先权 169
8.6 CSS中的单位 172
8.6.1 颜色单位 172
8.6.2 长度单位 172
8.6.3 时间单位 173
8.6.4 角度单位 173
8.6.5 频率单位 173
8.7 小结 173
本章习题 173
上机指导 175
实验一练习使用CSS内部样式表设定网页样式 175
实验二练习使用CSS外部样式表设定网页样式 175
实验三练习使用CSS伪类设定超连结的样式 176
第9章 设定文字和文本样式 178
9.1 设定文字样式 178
9.1.1 字型设定 178
9.1.2 设定文字大小 179
9.1.3 设定粗体 181
9.1.4 设定文字颜色 181
9.1.5 设定斜体 183
9.1.6 综合设定 183
9.2 设定文本样式 184
9.2.1 设定阴影效果 185
9.2.2 大小写转换 185
9.2.3 文本缩进 187
9.2.4 文本的水平对齐方式 188
9.2.5 文本的垂直对齐方式 189
9.2.6 设定文本流入方向 191
9.2.7 设定文本修饰 192
9.3 空白与换行 193
9.3.1 空格的处理方式 194
9.3.2 字内换行 195
9.4 设定间距 197
9.4.1 行间距 197
9.4.2 字间距 199
9.4.3 词间距 201
9.5 小结 203
本章习题 203
上机指导 203
实验一练习使用font属性综合设定文字样式 204
实验二练习使用不同的属性设定文本的样式 204
实验三练习使用不同的属性设定文本的间距 205
第10章 设定背景、框线、边距和补白 206
10.1 背景颜色 206
10.2 背景图像 207
10.2.1 设定背景图像 207
10.2.2 设定固定背景图像 209
10.2.3 设定背景图像平铺方式 210
10.2.4 背景图像定位 213
10.3 框线 215
10.3.1 设定框线样式 215
10.3.2 设定不同的框线样式 217
10.3.3 设定框线宽度 218
10.3.4 设定不同的框线宽度 220
10.3.5 设定框线颜色 222
10.3.6 设定不同的框线颜色 224
10.3.7 综合设定框线效果 225
10.4 边距 226
10.4.1 设定上边距 227
10.4.2 设定下边距 227
10.4.3 设定左边距 228
10.4.4 设定右边距 229
10.4.5 综合设定边距 230
10.5 补白 231
10.5.1 设定顶端补白 231
10.5.2 设定底部补白 232
10.5.3 设定左侧补白 233
10.5.4 设定右侧补白 234
10.5.5 综合设定补白 234
10.6 小结 235
本章习题 235
上机指导 235
实验一练习使用背景图像属性综合设定背景图像的样式 237
实验二练习使用框线属性综合设定元素框线的样式 237
实验三练习使用margin属性和padding属性综合设定元素的边距和补白 238
第11章 设定表格、列表和滚动条样式 240
11.1 表格 240
11.1.1 合併表格框线 240
11.1.2 定义表格框线间距 242
11.1.3 定义表格标题位置 244
11.1.4 设定表格布局 246
11.2 列表 248
11.2.1 设定列表符号样式 248
11.2.2 使用图片设定列表样式 251
11.2.3 列表符号显示位置 252
11.2.4 综合设定列表样式 253
11.3 滚动条 254
11.3.1 设定滚动条颜色 254
11.3.2 设定滚动条亮框线颜色 255
11.3.3 设定滚动条暗框线颜色 256
11.3.4 设定滚动条方向箭头颜色 257
11.3.5 设定滚动条基準色 258
11.4 小结 260
本章习题 260
上机指导 260
实验一练习使用CSS中的表格属性设定表格的样式 261
实验二练习使用CSS中的列表属性设定列表的样式 261
实验三练习使用CSS中的滚动条属性设定滚动条的样式 262
第四篇 布局学习篇
第12章 控制元素布局 265
12.1 块级元素和内联元素 265
12.1.1 块级元素和内联元素的概念 265
12.1.2 div元素和span元素 265
12.2 定位 267
12.2.1 定位方式 267
12.2.2 偏移 268
12.2.3 综合运用 268
12.2.4 定位元素的层叠次序 272
12.3 浮动 273
12.3.1 浮动的概念 274
12.3.2 设定浮动 274
12.3.3 清除浮动 275
12.4 溢出与剪下 276
12.4.1 溢出内容的设定 277
12.4.2 设定水平方向超出範围的处理方式 278
12.4.3 设定垂直方向超出範围的处理方式 279
12.4.4 内容的剪下 281
12.5 对象的显示与隐藏 282
12.6 小结 283
本章习题 283
上机指导 284
实验一练习使用定位设定元素的位置 284
实验二练习使用浮动设定元素的位置 285
实验三练习使用清除浮动清除元素的浮动效果 286
第13章 网页布局与设计技巧 287
13.1 网页布局 287
13.1.1 网页大小 287
13.1.2 网页栏目划分 288
13.1.3 表格布局 289
13.1.4 CSS布局 292
13.2 CSS布局技巧 293
13.2.1 一栏布局 293
13.2.2 二栏布局 295
13.2.3 多栏布局 296
13.3 小结 298
本章习题 298
上机指导 299
实验一利用表格设计网页 299
实验二利用CSS设计网页 300
实验三利用CSS对网页进行布局 301
第14章 网页布局综合案例——宝贝屋网上商店 302
14.1 案例分析 302
14.2 内容分析 303
14.3 原型设计 303
14.4 布局设计 305
14.4.1 整体样式设计 305
14.4.2 页头部分 306
14.4.3 内容部分 310
14.4.4 页脚部分 315
14.5 互动效果设计 316
14.5.1 顶部导航栏 316
14.5.2 主导航栏 317
14.5.3 账号区 317
14.5.4 图像框线 317
14.5.5 产品分类 318
14.6 小结 318