21天精通CSS3+DIV网页样式设计与布局PDF电子书下载

第1部分 掌握CSS使用技巧 4

第1天 激动人心的体验——CSS3样式体现 4

1.1认识CSS3 4

1.1.1 CSS3简介 4

1.1.2 CSS3发展历史 5

1.1.3浏览器与CSS3 5

1.2样式表的基本用法 6

1.2.1在HTML中插入样式表 6

1.2.2单独的链接CSS文件 6

1.3 CSS3新增的选择器 8

1.3.1属性选择器 8

1.3.2结构伪类选择器 9

1.3.3 UI元素状态伪类选择器 11

1.4技能训练——制作彩色标题 12

第2天CSS3的基本语法 16

2.1 CSS3选择器 16

2.1.1标签选择器 16

2.1.2类选择器 17

2.1.3 ID选择器 18

2.1.4全局选择器 19

2.1.5伪类选择器 20

2.2选择器声明 21

2.2.1集体声明 21

2.2.2多重嵌套声明 22

2.3 CSS3继承 23

2.4技能训练——制作网页新闻菜单 24

第3天用CSS3设置丰富的文字效果 28

3.1 CSS3文字样式 28

3.1.1定义文字的颜色 28

3.1.2定义文字的字体 29

3.1.3定义文字的字号 30

3.1.4加粗字体 32

3.1.5定义文字的风格 33

3.1.6文字的阴影效果 33

3.1.7控制溢出文本 35

3.1.8控制换行 36

3.1.9字体复合属性 37

3.1.10文字修饰效果 38

3.2 CSS3段落文字 39

3.2.1设置字符间隔 39

3.2.2设置单词间隔 40

3.2.3水平对齐方式 41

3.2.4垂直对齐方式 42

3.2.5文本缩进 44

3.2.6文本行高 45

3.3技能训练——网页图文混排效果 46

第4天用CSS3设置图片效果 48

4.1图片缩放 48

4.1.1通过标记设置图片大小 48

4.1.2使用CSS3中width和height 49

4.1.3使用CSS3中max-width和max-height 49

4.2设置图片的边框 51

4.3图片的对齐方式 52

4.3.1横向对齐方式 52

4.3.2纵向对齐方式 53

4.4图文混排效果 55

4.4.1设置图片与文字间距 55

4.4.2文字环绕效果 56

4.5技能训练——酒店宣传单 57

第5天用CSS3设置网页中的背景 61

5.1设置网页背景颜色 61

5.2设置背景图片 63

5.2.1添加背景图片 63

5.2.2设置背景图片位置 64

5.2.3背景图片重复效果 66

5.2.4背景图片滚动效果 67

5.3 CSS3新增的设置背景属性 69

5.3.1设置背景图片大小 69

5.3.2背景显示区域 70

5.3.3背景图像裁剪区域 72

5.4技能训练——我的个人主页 73

第6天 使用CSS3美化表格的样式 77

6.1 CSS3与表格 77

6.1.1表格的基本样式 77

6.1.2表格边框宽度 80

6.1.3表格边框颜色 81

6.2技能训练1——隔行变色 83

6.3技能训练2——鼠标悬浮变色表格 86

第7天 通过CSS3美化表单样式 90

7.1美化表单中的元素 90

7.2美化下拉菜单 92

7.3美化提交按钮 94

7.4技能训练1——美化注册表单 96

7.5技能训练2——美化登录表单 98

第8天用CSS3制作实用的菜单 101

8.1使用CSS3美化菜单 101

8.1.1美化无序列表 101

8.1.2美化有序列表 103

8.1.3图片列表 105

8.1.4列表缩进 106

8.2无须表格的菜单 108

8.3菜单的横竖转换 110

8.4技能训练1——制作SOSO导航栏 112

8.5技能训练2——制作模拟列表效果 116

第2部分 探讨CSS+D IV页面布局 122

第9天 修饰网站页面——鼠标特效与超链接特效 122

9.1鼠标特效 122

9.1.1如何控制鼠标箭头 122

9.1.2鼠标变换效果 124

9.2超链接特效 125

9.2.1改变超链接基本样式 125

9.2.2设置超链接背景图 128

9.2.3超链接按钮效果 129

9.3技能训练1——制作图片鼠标放置特效 130

9.4技能训练2——制作图片超链接 133

第10天 让一切趋近于完美——CSS3滤镜样式应用 135

10.1什么是CSS滤镜 135

10.2通道（Alpha） 136

10.3模糊（Blur） 138

10.4透明色（Chroma） 139

10.5翻转变换（Flip） 140

10.6光晕（Glow） 142

10.7灰度（Gray） 143

10.8反色（Invert） 144

10.9遮罩（Mask） 145

10.10阴影（Shadow） 146

10.11 X射线（X-ray） 147

10.12图像切换（RevealTrans） 148

10.13波浪（Wave） 150

10.14渐隐渐现（BlendTrans） 151

10.15 立体阴影（DropShadow） 153

10.16灯光滤镜（Light） 155

第11天 页面布局的黄金搭档——用CSS+DIV灵活进行网页布局 157

11.1认识DIV 157

11.1.1创建DIV 157

11.1.2为什么要用CSS+DIV布局 158

11.2 CSS定位与DIV布局 159

11.2.1盒子模型 159

11.2.2元素的定位 160

11.3 CSS+DIV布局的常用方法 167

11.3.1使用DIV对页面进行整体规划 167

11.3.2设计各块的位置 168

11.3.3使用CSS定位 168

11.4技能训练——制作个人网站首页 170

第12天 布局方式大探讨——CSS+DIV布局剖析 181

12.1布局方式分析 181

12.2 CSS排版样式 186

12.2.1设计上中下版式 186

12.2.2设计左右版式 191

12.2.3设计自适应宽度布局 196

12.2.4设计浮动布局 201

12.3新增CSS3多列布局 204

12.3.1设置列宽度 205

12.3.2设置列数 206

12.3.3设置列间距 208

12.3.4设置列边框样式 209

12.4技能训练1——制作当当网布局 211

12.5技能训练2——制作团购网的促销页面 216

第3部分CSS的高级应用 223

第13天 增加网页的动态效果——CSS与JavaScript的混合应用 223

13.1 JavaScript概述 223

13.1.1 JavaScript概念 223

13.1.2 JavaScript引用 224

13.1.3 JavaScript与CSS 225

13.2 JavaScript语法基础 226

13.2.1数据类型 226

13.2.2变量 227

13.2.3运算符 227

13.2.4流程控制语句 230

13.2.5函数 237

13.3技能训练1——制作字体的跑马灯效果 240

13.4技能训练2——文字升降特效 243

13.5技能训练3——打字效果的文字 244

13.6技能训练4——跟随鼠标移动的图片 246

第14天 这不再是神奇的传说——CSS与XML的混合应用 249

14.1 XML概述 249

14.1.1 XML简介 249

14.1.2 XML的技术优势 251

14.1.3 XML的商业优势 252

14.1.4 XML与HTML的关系 253

14.2 XML语法基础 254

14.2.1 XML文档组成和声明 254

14.2.2 XML元素介绍 256

14.2.3 XML属性 258

14.3 CSS修饰XML文件 259

14.3.1 XML使用CSS 259

14.3.2设置字体属性 260

14.3.3设置色彩属性 261

14.3.4设置边框属性 262

14.3.5设置文本属性 263

14.4技能训练1——制作古诗字画 265

14.5技能训练2——制作销售清单 268

14.6技能训练3——制作新闻页面 270

第15天 踏上革命性的征程——CSS与Ajax的混合应用 273

15.1Ajax概述 273

15.1.1初识Ajax 273

15.1.2 Ajax开发模式 274

15.1.3 Ajax的组合元素 275

15.2 Ajax的工作流程 276

15.3 CSS在Ajax中的应用 277

第4部分CSS+D IV综合实战 282

第16天 商业门户类网站设计 282

16.1整体设计 282

16.1.1颜色应用分析 283

16.1.2架构布局分析 283

16.2主要模块设计 284

16.2.1网页整体样式插入 284

16.2.2网页局部样式 286

16.2.3顶部模块样式代码分析 294

16.2.4中间主体代码分析 295

16.2.5底部模块分析 298

16.3网站调整 298

16.3.1部分内容调整 299

16.3.2模块调整 299

16.3.3调整后预览测试 301

第17天 教育科研类网站设计 303

17.1整体设计 303

17.1.1颜色应用分析 304

17.1.2架构布局分析 304

17.2主要模块设计 305

17.2.1网页整体样式插入 305

17.2.2顶部模块样式代码分析 308

17.2.3中间主体代码分析 310

17.2.4底部模块分析 311

17.3网站调整 312

17.3.1部分内容调整 312

17.3.2模块调整 313

17.3.3调整后预览测试 314

第18天 电子商务类网站设计 315

18.1整体布局 315

18.1.1整体设计分析 316

18.1.2架构布局分析 318

18.2主要模块设计 320

18.2.1样式代码分析 320

18.2.2网页头部代码分析 321

18.2.3分类及区域选择模块分析 322

18.2.4新品展示模块分析 324

18.2.5侧边栏模块分析 327

18.2.6热门城市索引模块分析 331

18.2.7底部模块分析 332

18.3网站调整 333

18.3.1部分内容调整 333

18.3.2模块调整 334

18.3.3调整后预览测试 334

第19天 娱乐休闲类网站设计 335

19.1整体设计 335

19.1.1应用设计分析 336

19.1.2架构布局分析 338

19.2主要模块设计 339

19.2.1网页整体样式插入 339

19.2.2顶部模块代码分析 341

19.2.3视频模块代码分析 342

19.2.4评论模块代码分析 342

19.2.5热门推荐模块代码分析 344

19.2.6底部模块分析 346

19.3网站调整 347

19.3.1部分内容调整 347

19.3.2调整后预览测试 349

第20天 图像影音类网站设计 350

20.1整体设计 350

20.1.1颜色应用分析 351

20.1.2架构布局分析 351

20.2主要模块设计 352

20.2.1样式代码分析 352

20.2.2顶部模块样式代码分析 357

20.2.3网站主体模块代码分析 358

20.2.4底部模块分析 362

20.3网站调整 363

20.3.1部分内容调整 363

20.3.2模块调整 364

20.3.3调整后预览测试 367

第21天 巧拿妙用——迅速武装起一个经典网站 369

21.1网站规划与分析 369

21.1.1网站框架设计 369

21.1.2网站栏目划分 370

21.1.3网站模块划分 370

21.1.4网站色彩搭配 371

21.2修改样式表确定网站风格 372

21.2.1修改网站通用样式 372

21.2.2修改网站布局样式 372

21.3借用其他网站优秀模块 374

21.3.1导航条模块实现 374

21.3.2首页主体布局模块实现 376

21.3.3网站底部模块实现 380