HTML5+CSS3网页设计 实战从入门到精通 视频教学版2025|PDF|Epub|mobi|kindle电子书版本百度云盘下载

HTML5+CSS3网页设计 实战从入门到精通 视频教学版PDF格式电子书版下载

注意：本站所有压缩包均有解压码： 点击下载压缩包解压工具

第1篇 HTML5网页设计4

第1章 HTML5快速入门4

1.1 HTML5概述4

1.1.1 HTML5简介4

1.1.2 HTML5文件的基本结构5

1.2 HTML5文件的编写方法5

1.2.1 案例1——手工编写HTML55

1.2.2 案例2——使用HTML编辑器编写HTML6

1.3 使用浏览器查看HTML5文件10

1.3.1 各大浏览器与HTML5的兼容10

1.3.2 案例3——查看页面效果11

1.3.3 案例4——查看源文件11

1.4 高手甜点12

1.5 跟我练练手12

第2章 HTML5网页文档结构14

2.1 Web标准14

2.1.1 Web标准概述14

2.1.2 Web标准规定的内容15

2.2 HTML5文档的基本结构16

2.2.1 HTML5结构16

2.2.2 文档类型说明17

2.2.3 HTML5标记＜html＞17

2.2.4 头标记＜head＞17

2.2.5 网页的主体标记＜body＞20

2.2.6 页面注释标记＜！--＞21

2.3 综合案例——符合W3C标准的HTML5网页22

2.4 高手甜点23

2.5 跟我练练手24

第3章 HTML5网页中的文本和图像26

3.1 在网页中添加文本26

3.1.1 案例1——普通文本的添加26

3.1.2 案例2——特殊字符文本的添加26

3.1.3 案例3——添加特殊文本28

3.2 文本排版30

3.2.1 案例4——换行标记＜br＞30

3.2.2 案例5——段落标记＜p＞31

3.2.3 案例6——标题标记＜h1＞～＜h6＞32

3.3 文字列表33

3.3.1 案例7——建立无序列表＜ul＞33

3.3.2 案例8——建立有序列表＜ol＞34

3.3.3 案例9——建立不同类型的无序列表35

3.3.4 案例10——建立不同类型的有序列表36

3.3.5 案例11——建立嵌套列表37

3.3.6 案例12——自定义列表＜dl＞38

3.4 网页中的图像39

3.4.1 案例13——插入图像＜img＞39

3.4.2 案例14——设置图像的宽度和高度width、height41

3.4.3 案例15——设置图片的提示文字alt42

3.4.4 案例16——将图片设置为网页背景background43

3.4.5 案例17——排列图像align44

3.5 综合案例1——图文并茂房屋装饰装修网页44

3.6 综合案例2——在线购物网站产品展示效果46

3.7 高手甜点47

3.8 跟我练练手48

第4章 用HTML5建立超链接50

4.1 网页超链接概述50

4.1.1 超链接的概念50

4.1.2 超链接中的URL50

4.1.3 超链接的URL类型51

4.2 建立网页超链接href51

4.2.1 案例1——创建超文本链接51

4.2.2 案例2——创建图片链接53

4.2.3 案例3——创建下载链接54

4.2.4 案例4——使用相对路径和绝对路径55

4.2.5 案例5——设置以新窗口显示超链接页面56

4.2.6 案例6——设置电子邮件链接58

4.3 案例7——浮动框架iframe59

4.4 案例8——精确定位热点区域map、area61

4.5 综合案例——使用锚链接制作电子书阅读网页64

4.6 高手甜点67

4.7 跟我练练手68

第5章 用HTML5创建表格和表单70

5.1 表格的基本结构70

5.2 使用HTML5创建表格72

5.2.1 案例1——创建普通表格＜table＞＜tr＞＜td＞72

5.2.2 案例2——创建一个带有标题的表格＜caption＞73

5.2.3 案例3——定义表格的边框类型border74

5.2.4 案例4——定义表格的表头＜th＞75

5.2.5 案例5——设置表格背景bgcolor、background76

5.2.6 案例6——设置单元格背景bgcolor78

5.2.7 案例7——合并单元格colspan、rowspan79

5.2.8 案例8——排列单元格中的内容align83

5.2.9 案例9——设置单元格的行高与列宽cellpadding84

5.3 案例10——创建完整的表格85

5.4 案例11——认识表单＜form＞87

5.5 表单基本元素的使用88

5.5.1 案例12——单行文本输入框text88

5.5.2 案例13——多行文本输入框textarea89

5.5.3 案例14——密码域password89

5.5.4 案例15——单选按钮radio90

5.5.5 案例16——复选框checkbox91

5.5.6 案例17——下拉列表框select92

5.5.7 案例18——普通按钮button93

5.5.8 案例19——提交按钮submit94

5.5.9 案例20——重置按钮reset95

5.6 表单高级元素的使用96

5.6.1 案例21——url属性的应用96

5.6.2 案例22——email属性的应用97

5.6.3 案例23——date和time的应用98

5.6.4 案例24——number属性的应用99

5.6.5 案例25——range属性的应用100

5.6.6 案例26——required属性的应用101

5.7 综合案例1——创建用户反馈单102

5.8 综合案例2——制作商品报价单103

5.9 高手甜点105

5.10 跟我练练手106

第6章 HTML5中的多媒体108

6.1 网页音频标记audio108

6.1.1 audio标记概述108

6.1.2 audio标记的属性108

6.1.3 音频解码器109

6.1.4 audio标记浏览器的支持情况109

6.2 网页视频标记video109

6.2.1 video标记概述109

6.2.2 video标记的属性110

6.2.3 视频解码器110

6.2.4 video标记浏览器的支持情况110

6.3 添加网页音频文件111

6.3.1 案例1——设置背景音乐111

6.3.2 案例2——设置音乐循环播放loop112

6.4 添加网页视频文件112

6.4.1 案例3——为网页添加视频文件video112

6.4.2 案例4——设置自动运行autoplay113

6.4.3 案例5——设置视频文件的循环播放loop114

6.4.4 案例6——设置视频窗口的高度与宽度height、width115

6.5 添加网页滚动文字115

6.5.1 案例7——滚动文字标记marquee116

6.5.2 案例8——滚动方向属性direction116

6.5.3 案例9——滚动方式属性behavior117

6.5.4 案例10——滚动速度属性scrollamount118

6.5.5 案例11——滚动延迟属性scrolldelay119

6.5.6 案例12——滚动循环属性loop120

6.5.7 案例13——滚动范围属性height、width121

6.5.8 案例14——滚动背景颜色属性bgcolor122

6.5.9 案例15——滚动空间属性hspace、vspace123

6.6 高手甜点124

6.7 跟我练练手124

第7章 使用HTML5绘制图形126

7.1 什么是canvas126

7.2 绘制基本形状127

7.2.1 案例1——绘制矩形127

7.2.2 案例2——绘制圆形128

7.2.3 案例3——使用moveTo与IineTo绘制直线129

7.2.4 案例4——使用bezierCurveTo绘制贝济埃曲线131

7.3 绘制渐变图形133

7.3.1 案例5——绘制线性渐变133

7.3.2 案例6——绘制径向渐变135

7.4 绘制变形图形136

7.4.1 案例7——变换原点坐标136

7.4.2 案例8——图形缩放137

7.4.3 案例9——旋转图形138

7.5 绘制其他样式的图形139

7.5.1 案例10——图形组合140

7.5.2 案例11——绘制带阴影的图形142

7.5.3 案例12——绘制文字143

7.6 使用图像145

7.6.1 案例13——绘制图像145

7.6.2 案例14——图像平铺146

7.6.3 案例15——图像裁剪148

7.6.4 案例16——像素处理149

7.7 图形的保存与恢复151

7.7.1 案例17——保存与恢复状态152

7.7.2 案例18——保存文件153

7.8 综合案例1——绘制火柴棒人物154

7.9 综合案例2——绘制商标157

7.10 高手甜点159

7.11 跟我练练手160

第8章 获取地理位置162

8.1 Geolocation API获取地理位置162

8.1.1 地理定位的原理162

8.1.2 获取定位信息的方法162

8.1.3 常用地理定位方法162

8.1.4 案例1——判断浏览器是否支持HTML5获取地理位置信息163

8.1.5 案例2——指定纬度和经度坐标164

8.1.6 案例3——获取当前位置的经度与纬度165

8.2 目前浏览器对地理定位的支持情况167

8.3 综合案例——在网页中调用Google地图168

8.4 高手甜点171

8.5 跟我练练手172

第9章 Web通信新技术174

9.1 跨文档消息传输174

9.1.1 跨文档消息传输的基本知识174

9.1.2 案例1——跨文档通信应用测试174

9.2 Web Sockets API177

9.2.1 WebSocket API的概念177

9.2.2 Web Sockets通信基础177

9.2.3 案例2——服务器端使用Web Sockets API179

9.2.4 案例3——客户端使用Web Sockets API183

9.3 综合案例——编写简单的Web Socket服务器183

9.4 高手甜点188

9.5 跟我练练手188

第10章 构建离线的Web190

10.1 HTML5离线Web应用概述190

10.2 使用HTML5离线Web应用API190

10.2.1 案例1——检查浏览器的支持情况190

10.2.2 案例2——搭建简单的离线应用程序191

10.2.3 案例3——支持离线行为191

10.2.4 案例4——manifest文件192

10.2.5 案例5——Application Cache API193

10.3 实例2——使用HTML5离线Web应用构建应用195

10.3.1 案例6——创建记录资源的manifest文件195

10.3.2 案例7——创建构成界面的HTML和CSS195

10.3.3 案例8——创建离线的JavaScript196

10.3.4 案例9——检查applicationCache的支持情况198

10.3.5 案例10——为Update按钮添加处理函数198

10.3.6 案例11——添加Storage功能代码199

10.3.7 案例12——添加离线事件处理程序199

10.4 高手甜点200

10.5 跟我练练手201

第2篇 CSS3美化网页206

第11章 CSS3概述与基本206

11.1 CSS3概述206

11.1.1 CSS3功能206

11.1.2 浏览器与CSS3206

11.1.3 CSS3基础语法207

11.1.4 CSS3常用单位207

11.2 编辑和浏览CSS3212

11.2.1 案例1——手工编写CSS3212

11.2.2 案例2——Dreamweaver编写CSS213

11.3 在HTML5中使用CSS3的方法215

11.3.1 案例3——行内样式215

11.3.2 案例4——内嵌样式216

11.3.3 案例5——链接样式217

11.3.4 案例6——导入样式219

11.3.5 案例7——优先级问题220

11.4 CSS3的常用选择器222

11.4.1 案例8——标签选择器223

11.4.2 案例9——类选择器223

11.4.3 案例10——ID选择器224

11.4.4 案例11——全局选择器225

11.4.5 案例12——组合选择器226

11.4.6 案例13——继承选择器227

11.4.7 案例14——伪类选择器228

11.5 选择器声明230

11.5.1 案例15——集体声明230

11.5.2 案例16——多重嵌套声明231

11.6 综合实例1——制作炫彩网站Logo231

11.7 综合案例2——制作学生信息统计表234

11.8 高手甜点236

11.9 跟我练练手237

第12章 使用CSS3美化网页字体与段落240

12.1 美化网页文字240

12.1.1 案例1——设置文字的字体240

12.1.2 案例2——设置文字的字号241

12.1.3 案例3——设置字体风格242

12.1.4 案例4——设置加粗字体243

12.1.5 案例5——将小写字母转换为大写字母244

12.1.6 案例6——设置字体的复合属性245

12.1.7 案例7——设置字体颜色246

12.2 设置文本的高级样式247

12.2.1 案例8——设置文本阴影效果248

12.2.2 案例9——设置文本溢出效果249

12.2.3 案例10——设置文本的控制换行250

12.2.4 案例11——保持字体尺寸不变251

12.3 美化网页中的段落252

12.3.1 案例12——设置单词之间的间隔252

12.3.2 案例13——设置字符之间的间隔253

12.3.3 案例14——设置文字的修饰效果254

12.3.4 案例15——设置垂直对齐方式255

12.3.5 案例16——转换文本的大小写257

12.3.6 案例17——设置文本的水平对齐方式258

12.3.7 案例18——设置文本的缩进效果260

12.3.8 案例19——设置文本的行高261

12.3.9 案例20——文本的空白处理262

12.3.10 案例21——文本的反排263

12.4 综合案例1——设置网页标题264

12.5 综合案例2——制作新闻页面266

12.6 高手甜点267

12.7 跟我练练手268

第13章 使用CSS3美化网页图片270

13.1 图片缩放270

13.1.1 案例1——通过描述标记width和height缩放图片270

13.1.2 案例2——使用CSS3中的max-width和max-height缩放图片270

13.1.3 案例3——使用CSS3中的width和height缩放图片272

13.2 设置图片的对齐方式272

13.2.1 案例4——设置图片横向对齐273

13.2.2 案例5——设置图片纵向对齐273

13.3 图文混排275

13.3.1 案例6——设置文字环绕效果275

13.3.2 案例7——设置图片与文字的间距277

13.4 综合案例1——制作学校宣传单278

13.5 综合案例2——制作简单图文混排网页281

13.6 高手甜点282

13.7 跟我练练手283

第14章 使用CSS3美化网页背景与边框286

14.1 使用CSS3美化背景286

14.1.1 案例1——设置背景颜色background-color286

14.1.2 案例2——设置背景图片background-image287

14.1.3 案例3——背景图片重复background-repeat288

14.1.4 案例4——背景图片显示background-attachment290

14.1.5 案例5——背景图片位置background-position291

14.1.6 案例6——背景图片大小background-size293

14.1.7 案例7——背景显示区域background-origin294

14.1.8 案例8——背景图像裁剪区域background-clip296

14.1.9 案例9——背景复合属性297

14.2 使用CSS3美化边框299

14.2.1 案例10——设置边框样式border-style299

14.2.2 案例11——设置边框颜色border-color300

14.2.3 案例12——设置边框线宽border-width302

14.2.4 案例13——设置边框复合属性303

14.3 设置边框圆角效果border-radius304

14.3.1 案例14——设置圆角边框304

14.3.2 案例15——指定两个圆角半径305

14.3.3 案例16——绘制四个不同圆角边框306

14.3.4 案例17——绘制不同种类的边框308

14.4 综合案例1——制作简单公司主页310

14.5 综合案例2——制作简单生活资讯主页314

14.6 高手甜点316

14.7 跟我练练手317

第15章 使用CSS3美化表格和表单样式320

15.1 美化表格样式320

15.1.1 案例1——设置表格边框样式border-collapse320

15.1.2 案例2——设置表格边框宽度border-width322

15.1.3 案例3——设置表格边框颜色background-color323

15.2 美化表单样式325

15.2.1 案例4——美化表单中的元素font325

15.2.2 案例5——美化提交按钮transparent327

15.2.3 案例6——美化下拉列表font328

15.3 综合案例1——制作用户登录页面330

15.4 综合案例2——制作用户注册页面332

15.5 高手甜点334

15.6 跟我练练手335

第16章 使用CSS3美化超链接和鼠标338

16.1 使用CSS3美化超链接338

16.1.1 案例1——改变超链接基本样式338

16.1.2 案例2——设置带有提示信息的超链接339

16.1.3 案例3——设置超链接的背景图340

16.1.4 案例4——设置超链接的按钮效果341

16.2 使用CSS3美化鼠标特效343

16.2.1 案例5——使用CSS3控制鼠标箭头343

16.2.2 案例6——设置鼠标变幻式超链接344

16.2.3 案例7——设置网页页面滚动条345

16.3 综合案例1——图片版本超链接348

16.4 综合案例2——关于鼠标特效实例350

16.5 综合案例3——制作一个简单的导航栏352

16.6 高手甜点354

16.7 跟我练练手355

第17章 使用CSS3控制网页导航菜单的样式358

17.1 使用CSS3美化项目列表358

17.1.1 案例1——美化无序列表358

17.1.2 案例2——美化有序列表360

17.1.3 案例3——美化自定义列表362

17.1.4 案例4——制作图片列表363

17.1.5 案例5——缩进图片列表364

17.1.6 案例6——列表复合属性365

17.2 使用CSS3制作网页菜单367

17.2.1 案例7——制作无序表格的菜单367

17.2.2 案例8——制作水平菜单369

17.3 综合案例1——模拟soso导航栏371

17.4 综合案例2——将段落转变成列表375

17.5 高手甜点377

17.6 跟我练练手377

第3篇 网页版式布局382

第18章 CSS定位与DIV布局核心技术382

18.1 了解块级元素和行内级元素382

18.1.1 案例1——块级元素和行内级元素的应用382

18.1.2 案例2——div元素和span元素的区别384

18.2 盒子模型385

18.2.1 盒子模型的概念385

18.2.2 案例3——定义网页border区域386

18.2.3 案例4——定义网页padding区域387

18.2.4 案例5——定义网页margin区域388

18.3 CSS3新增弹性盒模型392

18.3.1 案例6——定义盒子布局取向（box-orient）392

18.3.2 案例7——定义盒子布局顺序（box-direction）394

18.3.3 案例8——定义盒子布局位置（box-ordinal-group）395

18.3.4 案例9——定义盒子弹性空间（box-flex）397

18.3.5 案例10——管理盒子空间（box-pack和box-align）399

18.3.6 案例11——盒子空间的溢出管理（box-lines）401

18.4 综合案例1——图文排版效果402

18.5 综合案例2——淘宝导购菜单404

18.6 高手甜点407

18.7 跟我练练手408

第19章 CSS＋DIV盒子的浮动与定位410

19.1 定义DIV410

19.1.1 什么是DIV410

19.1.2 案例1——创建DIV410

19.2 盒子的定位411

19.2.1 案例2——静态定位static412

19.2.2 案例3——相对定位relative412

19.2.3 案例4——绝对定位absolute413

19.2.4 案例5——固定定位fixed414

19.2.5 案例6——盒子的浮动float416

19.3 其他CSS布局定位方式418

19.3.1 案例7——溢出（overflow）定位418

19.3.2 案例8——隐藏（visibility）定位419

19.3.3 案例9——z-index空间定位421

19.4 新增CSS3多列布局423

19.4.1 案例10——设置列宽度column-width423

19.4.2 案例11——设置列数column-count424

19.4.3 案例12——设置列间距column-gap426

19.4.4 案例13——设置列边框样式column-rule427

19.5 综合案例1——定位网页布局样式429

19.6 综合案例2——制作阴影文字效果432

19.7 高手甜点433

19.8 跟我练练手434

第20章 网页布局实战案例剖析436

20.1 固定宽度网页剖析与布局436

20.1.1 案例1——网页单列布局模式436

20.1.2 案例2——网页1-2-1型布局模式440

20.1.3 案例3——网页1-3-1型布局模式443

20.2 自动缩放网页1-2-1型布局模式447

20.2.1 案例4——“1-2-1”等比例变宽布局447

20.2.2 案例5——“1-2-1”单列变宽布局448

20.3 自动缩放网页1-3-1型布局模式449

20.3.1 “1-3-1”三列宽度等比例布局449

20.3.2 案例6——“1-3-1”单侧列宽度固定的变宽布局450

20.3.3 案例7——“1-3-1”中间列宽度固定的变宽布局454

20.3.4 案例8——“1-3-1”双侧列宽度固定的变宽布局458

20.3.5 案例9——“1-3-1”中列和左侧列宽度固定的变宽布局462

20.4 综合案例1——单列宽度变化布局465

20.5 综合案例2——多列等比例宽度变化布局467

20.6 高手甜点470

20.7 跟我练练手471

第4篇 综合案例实战476

第21章 制作在线购物类网页476

21.1 整体布局476

21.1.1 设计分析476

21.1.2 排版架构477

21.2 主要模块设计477

21.2.1 Logo与导航区477

21.2.2 Banner与资讯区479

21.2.3 产品类别区域480

21.2.4 页脚区域481

第22章 制作移动设备类网页484

22.1 网站设计分析484

22.2 网站结构分析484

22.3 网站主页面的制作485

22.4 网站成品预览487

第23章 制作娱乐休闲类网页494

23.1 整体设计494

23.1.1 应用设计分析494

23.1.2 架构布局分析495

23.2 主要模块设计496

23.2.1 网页整体样式插入496

23.2.2 顶部模块代码分析498

23.2.3 视频模块代码分析499

23.2.4 评论模块代码分析500

23.2.5 热门推荐模块代码分析501

23.2.6 底部模块分析504

23.3 网页调整504

23.3.1 部分内容调整504

23.3.2 调整后预览测试506