新書推薦:
《
甲骨拼合六集
》
售價:HK$
333.8
《
视觉美食家:商业摄影实战与创意解析
》
售價:HK$
132.2
《
中国经济发展的新阶段:机会与选择
》
售價:HK$
99.7
《
DK月季玫瑰百科
》
售價:HK$
210.6
《
为你想要的生活
》
售價:HK$
66.1
《
关键改变:如何实现自我蜕变
》
售價:HK$
77.3
《
超加工人群:为什么有些食物让人一吃就停不下来
》
售價:HK$
99.7
《
历史的教训(浓缩《文明的故事》精华,总结历史教训的独特见解)
》
售價:HK$
62.7
|
編輯推薦: |
全程案例实战,精简繁琐的概念知识,重点精炼案例,通过案例让读者快速理解学习知识。提供6个行业项目案例,使读者快速积累行业经验。
|
內容簡介: |
《CSS3 DIV网页样式与布局(全案例微课版)》是针对零基础读者编写的网页样式与布局入门教材。本书侧重案例实训,并提供扫码微课来讲解当前的热点案例。 《CSS3 DIV网页样式与布局(全案例微课版)》分为24章,内容包括网页设计需要学什么、网页实现技术HTML5、初始CSS3层叠样式表、CSS3选择器的应用及特性、使用CSS3设计字体与文本样式、使用CSS3设计图片与边框样式、使用CSS3控制网页背景样式、使用CSS3定义链接与鼠标样式、使用CSS3设计表格样式、使用CSS3设计表单样式、使用CSS3设计列表与菜单样式、使用CSS3滤镜设计网页图片特效、使用CSS3设计动画效果、使用CSS3中的盒子模型、CSS3 DIV布局的浮动与定位、使用CSS3布局网页版式、设计可响应式的移动网页、使用JavaScript控制CSS3样式、使用CSS设计XML 文档样式、流行的响应式开发框架Bootstrap以及4个热点综合项目。 《CSS3 DIV网页样式与布局(全案例微课版)》通过精选热点案例,让初学者快速掌握网页样式与布局的开发技术。通过微信扫码看视频,读者可以随时在移动端观看案例对应的视频操作。
|
關於作者: |
刘辉在河南财经大学主要负责网页设计、网站开发和Android开发课程,主要擅长HTML5、CSS3、JavaScript、jQuery技术,一直负责毕业班的实训工作,在移动终端软件开发方面有多年的开发经验,具有很强的实战经验。
|
目錄:
|
第1章 网页设计需要学什么 001
1.1 认识网页和网站 002
1.1.1 认识网页 002
1.1.2 认识网站 003
1.2 网页设计需要的技术 004
1.2.1 HTML 004
1.2.2 DIV布局 005
1.2.3 CSS样式 005
1.2.4 脚本语言JavaScript 006
1.3 网页文档的基本结构 007
1.3.1 制作个网页 007
1.3.2 文档类型说明 008
1.3.3 html标签 008
1.3.4 头部标签 008
1.3.5 主体标签 008
1.3.6 注释标签 009
1.4 网页设计的流程 009
1.4.1 网站规划 010
1.4.2 搜集资料 010
1.4.3 设计网页结构 010
1.4.4 获取网页素材 011
1.4.5 搭建网页DIV层 012
1.4.6 设计网页效果 013
1.4.7 测试网页 013
第2章 网页实现技术——HTML5 015
2.1 HTML5中的常用标签 016
2.1.1 基础标签的应用 016
2.1.2 文本格式标签 017
2.1.3 超级链接标签 017
2.1.4 列表标签的应用 018
2.2 HTML5中的图像标签 019
2.2.1 插入并编辑网页中的图像 020
2.2.2 定义图像热点区域 021
2.2.3 绘制网页图形图像 022
2.3 HTML5中的表单标签 023
2.3.1 文本类输入框 024
2.3.2 按钮类输入框 025
2.3.3 网页中的按钮 026
2.3.4 图像域和文件域 027
2.3.5 设置表单中的列表 028
2.3.6 表单常用属性的应用 029
2.4 HTML5中的表格标签 030
2.4.1 表格的基本结构 030
2.4.2 使用属性编辑表格 031
2.4.3 完整的表格标签 033
2.5 HTML5中的多媒体标签 034
2.5.1 audio标签的应用 034
2.5.2 在网页中添加音频文件 035
2.5.3 认识video标签 036
2.5.4 在网页中添加视频文件 037
2.6 标签 039
2.7 标签 040
2.8 新手常见疑难问题 041
2.9 实战技能训练营 041
第3章 初始CSS3层叠样式表 042
3.1 CSS概述 043
3.1.1 CSS的功能介绍 043
3.1.2 CSS的发展历史 043
3.1.3 CSS的构造规则 044
3.1.4 CSS的注释 044
3.2 CSS中的常用单位 045
3.2.1 颜色单位 045
3.2.2 长度单位 048
3.3 创建和编辑CSS 文件 049
3.4 在HTML5 中调用CSS 的方法 051
3.4.1 行内样式 051
3.4.2 内嵌样式 052
3.4.3 链接样式 053
3.4.4 导入样式 054
3.5 调用方法的优先级 055
3.5.1 行内样式和内嵌样式比较 055
3.5.2 内嵌样式和链接样式比较 055
3.5.3 链接样式和导入样式 056
3.6 新手常见疑难问题 057
3.7 实战技能训练营 057
第4 章 CSS3 选择器的特性及应用 058
4.1 认识CSS 选择器 059
4.2 选择器的应用 059
4.2.1 标签选择器 059
4.2.2 类选择器 061
4.2.3 ID 选择器 062
4.2.4 全局选择器 063
4.2.5 组合选择器 063
4.2.6 继承选择器 064
4.2.7 伪类选择器 065
4.2.8 属性选择器 066
4.2.9 结构伪类选择器 067
4.2.10 UI 元素状态伪类选择器 068
4.3 选择器声明 069
4.3.1 集体声明 069
4.3.2 多重嵌套声明 070
4.4 CSS3 的继承特性 070
4.4.1 继承关系 070
4.4.2 CSS 继承的运用 071
4.5 CSS3 的层叠特性 072
4.5.1 同一选择器被多次定义的处理 072
4.5.2 同一标签运用不同类型选择器的处理 072
4.6 新手常见疑难问题 073
4.7 实战技能训练营 073
第5 章 使用CSS3 设计字体与文本样式 074
5.1 设置字体样式 075
5.1.1 控制字体类型 075
5.1.2 定义字体大小 076
5.1.3 定义字体风格 077
5.1.4 控制文字的粗细 077
5.1.5 将小写字母转换为大写字母 078
5.1.6 设置字体的复合属性 079
5.1.7 定义文字的颜色 080
5.2 设置文本的高级样式 081
5.2.1 添加文本的阴影效果 081
5.2.2 设置文本溢出效果 082
5.2.3 控制文本的换行 082
5.2.4 设置字体尺寸 083
5.3 设置文本间距与对齐方式 084
5.3.1 设置单词之间的间隔 084
5.3.2 设置字符之间的间隔 085
5.3.3 为文本添加装饰线 086
5.3.4 设置垂直对齐方式 086
5.3.5 转换文本的大小写 088
5.3.6 设置文本的水平对齐方式 088
5.3.7 设置文本的缩进效果 090
5.3.8 设置文本的行间距 090
5.3.9 文本的空白处理 091
5.3.10 文本的反排 092
5.4 新手常见疑难问题 093
5.5 实战技能训练营 093
第6 章 使用CSS3 设计图片与边框样式 095
6.1 图片样式基础 096
6.1.1 图片大小 096
6.1.2 图片对齐 097
6.1.3 文字环绕图片 099
6.1.4 图片与文字的间距 100
6.2 边框样式基础 101
6.2.1 边框样式 101
6.2.2 边框颜色 103
6.2.3 边框线宽 104
6.2.4 边框复合属性 105
6.3 圆角边框样式 106
6.3.1 定义圆角边框 106
6.3.2 指定两个圆角半径 107
6.3.3 绘制四个不同圆角的边框 107
6.3.4 绘制不同种类的边框 108
6.4 新手常见疑难问题 110
6.5 实战技能训练营 110
第7 章 使用CSS3 控制网页背景样式 111
7.1 背景样式基础 112
7.1.1 设置背景颜色 112
7.1.2 网页板块配色 113
7.1.3 设置背景图像 114
7.1.4 平铺背景图像 115
7.1.5 固定背景图像 116
7.1.6 定位背景图像 117
7.2 新增控制背景属性 119
7.2.1 背景图像大小 119
7.2.2 背景显示区域 120
7.2.3 裁剪背景图像 121
7.2.4 背景复合属性 122
7.3 网页背景渐变效果 123
7.3.1 线性渐变效果 123
7.3.2 径向渐变效果 124
7.4 新手常见疑难问题 125
7.5 实战技能训练营 126
第8 章 使用CSS3 定义链接和鼠标样式 127
8.1 链接样式基础 128
8.1.1 设置链接样式 128
8.1.2 定义下划线样式 130
8.1.3 定义链接背景图 131
8.1.4 定义链接提示信息 132
8.1.5 定义链接按钮 133
8.2 定义鼠标指针特效 134
8.2.1 鼠标样式基础 134
8.2.2 变幻鼠标光标 137
8.2.3 定义滚动条样式 138
8.3 新手常见疑难问题 139
8.4 实战技能训练营 140
第9 章 使用CSS3 设计表格样式 141
9.1 表格样式基础 142
9.1.1 设置表格颜色 142
9.1.2 设置表格边框 143
9.1.3 设置表格边框宽度 144
9.1.4 设置表格边框颜色 145
9.1.5 设置表格标题的位置 145
9.1.6 隐藏空单元格 146
9.1.7 设置单元格的边距 147
9.2 设置悬浮变色的表格 148
9.3 使用表格布局网页 151
9.4 新手常见疑难问题 153
9.5 实战技能训练营 153
第10 章 使用CSS3 设计表单样式 154
10.1 表单样式基础 155
10.1.1 表单字体样式 155
10.1.2 表单边框样式 156
10.1.3 表单背景样式 157
10.1.4 设计表单按钮样式 158
10.1.5 设计下拉菜单样式 159
10.2 制作用户登录页面 160
10.3 制作用户注册页面 161
10.4 新手常见疑难问题 162
10.5 实战技能训练营 163
第11 章 使用CSS3 设计列表与菜单样式 164
11.1 项目列表样式 165
11.1.1 无序项目列表 165
11.1.2 有序项目列表 166
11.1.3 自定义项目列表 167
11.1.4 图片列表样式 168
11.1.5 设置图片列表的位置 169
11.1.6 列表复合属性的应用 170
11.1.7 将段落转变成列表 171
11.2 菜单样式基础 172
11.2.1 制作动态导航菜单 172
11.2.2 制作水平方向菜单 173
11.2.3 制作多级菜单列表 175
11.2.4 模拟制作SOSO 导航栏 177
11.3 新手常见疑难问题 179
11.4 实战技能训练营 179
第12 章 使用CSS3 滤镜设计网页图片特效 180
12.1 CSS3 中的滤镜 181
12.2 设置基本滤镜效果 182
12.2.1 高斯模糊(blur)滤镜 182
12.2.2 明暗度(brightness)滤镜 183
12.2.3 对比度(contrast)滤镜 183
12.2.4 阴影(drop-shadow)滤镜 184
12.2.5 灰度(grayscale)滤镜 185
12.2.6 反相(invert)滤镜 185
12.2.7 透明度(opacity)滤镜 186
12.2.8 饱和度(saturate)滤镜 187
12.2.9 深褐色(sepia)滤镜 188
12.2.10 使用复合滤镜效果 188
12.3 新手常见疑难问题 189
12.4 实战技能训练营 189
第13 章 使用CSS3 设计动画效果 191
13.1 2D 转换动画效果 192
13.1.1 添加2D 移动效果 192
13.1.2 添加2D 旋转效果 193
13.1.3 添加2D 缩放效果 194
13.1.4 添加2D 倾斜效果 195
13.1.5 添加2D 综合变换效果 196
13.2 3D 转换动画效果 197
13.2.1 添加3D 移动效果 197
13.2.2 添加3D 旋转效果 200
13.2.3 添加3D 缩放效果 202
13.3 设计过渡动画效果 204
13.3.1 设置过渡属性 204
13.3.2 设置过渡时间 205
13.3.3 设置延迟时间 206
13.3.4 设置过渡动画类型 207
13.4 设计帧动画效果 208
13.4.1 设置关键帧 208
13.4.2 设置动画属性 210
13.5 新手常见疑难问题 212
13.6 实战技能训练营 213
第14 章 使用CSS 中的盒子模型 214
14.1 块级元素与行内级元素 215
14.1.1 块级元素的应用 215
14.1.2 行内元素的应用 216
14.2 盒子模型 216
14.2.1 定义盒子边界 217
14.2.2 定义盒子边框 219
14.2.3 定义盒子补白 220
14.2.4 定义盒子大小 221
14.3 CSS3 新增的盒子模型属性 222
14.3.1 定义盒子的布局方向 223
14.3.2 定义盒子的布局顺序 224
14.3.3 定义盒子的布局位置 225
14.3.4 定义盒子的显示空间 226
14.3.5 管理盒子空间的大小 227
14.3.6 盒子空间的溢出管理 228
14.4 弹性盒子模型 229
14.4.1 使用弹性盒子 229
14.4.2 设置弹性子元素的位置 231
14.4.3 设置弹性子元素的横向对齐方式 231
14.4.4 设置弹性子元素的纵向对齐方式 233
14.4.5 设置弹性子元素的换行方式 234
14.5 新手常见疑难问题 235
14.6 实战技能训练营 236
第15 章 CSS DIV 布局的浮动与定位 237
15.1 定义DIV 238
15.1.1 什么是DIV 238
15.1.2 创建DIV 238
15.2 网页元素的定位 238
15.2.1 静态定位 239
15.2.2 相对定位 239
15.2.3 定位 240
15.2.4 固定定位 241
15.2.5 浮动定位 241
15.3 其他CSS 布局定位方式 242
15.3.1 溢出(overflow)定位 243
15.3.2 隐藏(visibility)定位 244
15.3.3 z-index 空间定位 245
15.4 新增CSS3 多列布局 245
15.4.1 设置列宽度 246
15.4.2 设置列数 246
15.4.3 设置列间距 247
15.4.4 设置列边框样式 248
15.5 新手常见疑难问题 250
15.6 实战技能训练营 250
第16 章 使用CSS3 布局网页版式 251
16.1 认识CSS3 布局版式 252
16.1.1 将页面用DIV 分块 252
16.1.2 设置各块位置 252
16.1.3 用CSS 定位版式 253
16.2 固定宽度网页布局模式 255
16.2.1 网页单列布局模式 255
16.2.2 网页1-2-1 型布局模式 258
16.2.3 网页1-3-1 型布局模式 260
16.3 自动缩放网页布局模式 262
16.3.1 1-2-1 等比例变宽布局 262
16.3.2 1-2-1 单列变宽布局 262
16.3.3 1-3-1 单侧列宽度固定布局 263
16.3.4 1-3-1 中间列宽度固定布局 265
16.3.5 1-3-1 双侧列宽度固定布局 267
16.3.6 1-3-1 中列和左侧列宽度固定布局 269
16.4 新手常见疑难问题 271
16.5 实战技能训练营 271
第17 章 设计可响应式的移动网页 273
17.1 什么是响应式网页设计 274
17.2 像素和屏幕分辨率 275
17.3 视口 275
17.3.1 视口的分类和常用属性 275
17.3.2 媒体查询 276
17.4 设计响应式网页的布局 277
17.4.1 常用布局类型 277
17.4.2 布局的实现方式 277
17.4.3 响应式布局的设计与实现 278
17.5 设计响应式图片 279
17.5.1 使用 标签 279
17.5.2 使用CSS 图片 280
17.6 设计响应式视频 281
17.7 设计响应式导航菜单 282
17.8 设计响应式表格 284
17.8.1 隐藏表格中的列 284
17.8.2 滚动表格中的列 285
17.8.3 转换表格中的列 286
17.9 新手常见疑难问题 288
17.10 实战技能训练营 289
第18 章 使用JavaScript 控制CSS3 样式 290
18.1 JavaScript 语法基础 291
18.1.1 什么是JavaScript 291
18.1.2 数据类型 291
18.1.3 变量 292
18.1.4 运算符 293
18.1.5 流程控制语句 295
18.1.6 JavaScript 中的函数 297
18.2 常见的JavaScript 编写工具 299
18.2.1 记事本编写工具 299
18.2.2 Dreamweaver 编写工具 300
18.3 JavaScript 在HTML 中的使用 300
18.3.1 在HTML 网页头中嵌入JavaScript代码 301
18.3.2 在HTML 网页中嵌入JavaScript代码 301
18.3.3 在HTML 网页的元素事件中嵌入JavaScript代码 302
18.3.4 在HTML 中调用JavaScript 文件 303
18.3.5 通过JavaScript 伪URL 引入JavaScript脚本代码 303
18.4 JavaScript 与CSS3 的结合使用 304
18.4.1 动态改变网页元素 304
18.4.2 改变网页元素的动态样式 305
18.4.3 动态定位网页元素 306
18.4.4 设置网页元素的显示与隐藏 307
18.5 HTML5、CSS3 和JavaScript 的搭配应用 308
18.5.1 设定左右移动的图片 308
18.5.2 制作背景颜色选择器 310
18.5.3 制作文字跑马灯效果 312
18.6 新手常见疑难问题 313
18.7 实战技能训练营 314
第19 章 使用CSS 设计XML 文档样式 315
19.1 XML 语法基础 316
19.1.1 XML 的基本应用 316
19.1.2 XML 文档的组成和声明 317
19.1.3 XML 元素介绍 318
19.2 CSS 修饰XML 文件 319
19.2.1 在XML 中使用CSS 320
19.2.2 设置字体属性 320
19.2.3 设置色彩属性 321
19.2.4 设置边框属性 322
19.2.5 设置文本属性 322
19.3 新手常见疑难问题 323
19.4 实战技能训练营 323
第20 章 流行的响应式开发框架Bootstrap 325
20.1 Bootstrap 概述 326
20.1.1 Bootstrap 的特色 326
20.1.2 Bootstrap 4 的重大更新 326
20.2 下载与安装Bootstrap 327
20.2.1 下载Bootstrap 327
20.2.2 安装Bootstrap 329
20.2.3 使用Bootstrap 329
20.3 使用常用组件 330
20.3.1 使用下拉菜单 330
20.3.2 使用按钮组 331
20.3.3 使用导航组件 332
20.3.4 绑定导航和下拉菜单 334
20.3.5 使用面包屑 335
20.3.6 使用广告屏 335
20.3.7 使用card(卡片) 336
20.3.8 使用进度条 337
20.3.9 使用模态框 340
20.3.10 使用滚动监听 342
20.4 胶囊导航选项卡(Tab 栏) 344
20.5 新手常见疑难问题 345
20.6 实战技能训练营 346
第21 章 项目实训1——开发连锁咖啡响应式网站 347
21.1 网站概述 348
21.1.1 网站结构 348
21.1.2 设计效果 348
21.1.3 设计准备 349
21.2 设计首页布局 350
21.3 设计可切换导航 351
21.4 主体内容 356
21.4.1 设计轮播广告区 356
21.4.2 设计产品推荐区 358
21.4.3 设计登录、注册按钮和Logo 359
21.4.4 设计特色展示区 360
21.4.5 设计产品生产流程区 361
21.5 设计底部隐藏导航 364
第22 章 项目实训2——开发房产企业响应式网站 365
22.1 网站概述 366
22.1.1 网站结构 366
22.1.2 设计效果 366
22.1.3 设计准备 367
22.2 设计主页 367
22.2.1 主页布局 367
22.2.2 设计导航条 368
22.2.3 设计轮播广告 370
22.2.4 设计功能区 372
22.2.5 设计特色展示 373
22.2.6 设计脚注 377
22.3 设计侧边导航栏 378
22.4 设计登录页 380
第23 章 项目实训3——开发在线购物网站 382
23.1 整体布局 383
23.1.1 设计分析 383
23.1.2 排版架构 383
23.2 主要模块设计 384
23.2.1 Logo 与导航区 384
23.2.2 Banner 与资讯区 385
23.2.3 产品类别区域 387
23.2.4 页脚区域 388
第24 章 项目实训4——开发企业门户网站 389
24.1 构思布局 390
24.1.1 设计分析 390
24.1.2 排版架构 390
24.2 主要模块设计 391
24.2.1 Logo 与导航菜单 391
24.2.2 Banner 区 392
24.2.3 资讯区 393
24.2.4 版权信息 395
|
內容試閱:
|
为什么要写这样一本书
伴随着Web 2.0潮流的盛行,传统的表格布局模式正逐渐被网页标准化CSS的设计方式取代,对CSS3 DIV布局的学习也成为网页设计师的必修功课。对于初学者来说,实用性强和易于操作是目前的需求。本书面向想学习网页样式和布局的初学者,可以让初学者入门后快速提高实战水平。通过本书的案例实训,大学生可以很快地掌握流行的网页样式和布局方法,提高职业化能力,从而帮助解决公司与学生的双重需求问题。
本书特色
零基础、入门级的讲解
无论您是否从事计算机相关行业,也无论您是否接触过网页样式和布局,都能从本书中找到起点。
实用、专业的范例和项目
本书在编排上紧密结合深入学习网页样式和布局开发的过程,从网页样式和布局的基本概念开始,逐步带领读者学习网页样式和布局开发的各种应用技巧,侧重实战技能,使用简单易懂的实际案例进行分析和操作指导,让读者学起来简明轻松,操作起来有章可循。
随时随地学习
本书提供了微课视频,通过手机扫码即可观看,随时随地解决学习中的困惑。
全程同步教学录像
教学录像涵盖本书所有知识点,详细讲解每个实例及项目的制作过程及技术关键点,可以比看书更轻松地掌握书中所有的网页制作和设计知识,而且扩展的讲解部分可以使您得到比书中更多的收获。
超多容量王牌资源
赠送大量王牌资源,包括实例源代码、教学幻灯片、本书精品教学视频、88个实用的网页模板、12部网页开发参考手册、HTML5标签速查手册、精选的JavaScript实例、CSS3属性速查表、JavaScript函数速查手册、CSS DIV布局赏析案例、精彩网站配色方案赏析、网页样式与布局案例赏析、Web前端工程师常见面试题等。
读者对象
本书是一本完整介绍网页样式和布局开发技术的教程,内容丰富、条理清晰、实用性强,适合以下读者学习使用。
零基础的网页样式和布局自学者。
希望快速、全面掌握网页样式和布局的人员。
高等院校或培训机构的老师和学生。
参加毕业设计的学生。
如何获取本书配套资料和帮助
为帮助读者高效、快捷地学习本书知识点,我们不但为读者准备了与本书知识点有关的配套素材文件,而且设计并制作了精品视频教学课程,读者在学习本书的过程中,使用手机浏览器、QQ 或者微信的扫一扫功能,扫描各标题下的二维码,可以在打开的视频播放页面中在线观看视频课程,也可以下载并保存到手机中离线观看。
创作团队
本书由刘辉编著,参加编写的人员还有刘春茂、李艳恩和张华。在编写本书的过程中,我们虽竭尽所能将好的讲解呈现给读者,但难免有疏漏和不妥之处,敬请读者不吝指正。
编者
|
|