Dreamweaver CS6+HTML 5+CSS 3网页制作基础教程（微课版） PDF下载

编辑推荐

本书以HTML 5和CSS 3的基础知识作为重点讲解对象，在W3C规范的指导下，将其分散在Dreamweaver软件的讲解之中，并将前端的思维模式融入到每个知识点中，配合免费的微课视频，使读者完全能够自主的进行学习，掌握的必备知识和技能。全书共分为12章，章节安排难度递进，必备知识无缝衔接，每章有理论，堂堂有案例，课后有实训。主要内容包括：网页设计基础； HTML语言基础； Dreamweaver基础与CSS入门；文本与图像；浮动、定位和列表；表格与表单；框架、模板与CSS 3新增布局；行为与Spry构件； CSS进阶提高；站点测试、上传与维护；综合案例解析——电子商务网站；实训指导书。本书可作为应用型本科、高职高专院校计算机相关专业的教材，也可供想从事网页设计的读者自学使用，还可作为IT类培训机构的网页设计培训教程。

 ；

内容简介

本书以HTML 5和CSS 3的基础知识作为重点讲解对象，在W3C规范的指导下，将其分散在Dreamweaver软件应用的讲解之中，并将前端的思维模式融入每个知识点中，配合免费的微课视频，使读者完全能够自主学习，掌握必备的知识和技能。全书共分为12章，章节安排难度递进，必备知识无缝衔接，每章有理论，堂堂有案例，课后有实训。 在理论知识方面，一方面讲解Dreamweaver软件的使用方法，另一方面注重与HTML 5和CSS 3相关的前端知识的补充，使学生理解更为透彻，能够融会贯通。 在实践操作方面，注重提高读者的手写代码能力，每章除了小型案例以外，还提供模仿案例和自主提高案例，读者可不断强化所学知识。 本书可作为应用型本科及各层次职业院校计算机相关专业的教材，还可作为IT类培训机构的网页设计培训教程。

作者简介

暂无

目录

1.1Web时代的重要理念1
1.1.1Web标准简介1
1.1.2表现与结构相分离3
1.1.3HTML 5时代5
1.2网站的入门知识6
1.2.1网页、网站及其构成元素6
1.2.2网页设计的原则、风格和潮流8
1.2.3网站建设的基本流程11
1.2.4开发与调试工具13
1.3习题14
第2章HTML语言基础15
2.1HTML的历史沿革15
2.1.1从HTML 4.01到XHTML15
2.1.2从XHTML到HTML 515
2.1.3HTML 5要解决的问题16
2.2文档结构17
2.2.1标签、元素、属性和值17
2.2.2DOCTYPE声明19
2.2.3html元素、head元素与body元素19
2.3HTML 5中常见的元素20
2.3.1块级元素21
2.3.2内联元素22
2.3.3列表类元素25
2.3.4表格类元素27
2.3.5表单类元素28
2.3.6多媒体类元素33
2.3.7HTML 5新增的结构类元素35
2.4过程指导——HTML 5元素的简单运用37
2.5自主任务——使用记事本创建简单页面40
2.6习题40
Dreamweaver CS6 HTML 5 CSS 3网页制作基础教程(微课版)目录第3章Dreamweaver基础与CSS入门42
3.1工作环境42
3.1.1文档和编码工具栏42
3.1.2属性面板44
3.1.3常用面板介绍45
3.1.4常规设置46
3.2站点47
3.2.1站点的基本概念及其创建方法47
3.2.2“文件”面板的常用操作49
3.2.3管理站点51
3.3重要的div元素52
3.3.1div元素是什么53
3.3.2在Dreamweaver中创建DIV容器的方法53
3.4CSS入门55
3.4.1什么是CSS56
3.4.2CSS语法与链接方法56
3.4.3盒子模型58
3.5常见的CSS选择器61
3.5.1通配符选择器与类型选择器62
3.5.2ID选择器与类选择器62
3.5.3包含选择器与群组选择器64
3.5.4属性选择器64
3.6过程指导——淘宝店铺周年庆专题页面66
3.6.1过程分析66
3.6.2步骤详解66
3.7自主任务——“中秋茶相伴”淘宝店铺专题销售页面72
3.8习题72
第4章文本与图像74
4.1文本74
4.1.1插入文本74
4.1.2创建超链接75
4.1.3与文本相关的基础属性78
4.1.4行高与首行缩进81
4.1.5文本阴影83
4.1.6溢出文本与文本换行83
4.1.7CSS伪类在超链接方面的应用86
4.2图像87
4.2.1插入图像与图像超链接88
4.2.2与图像相关的CSS属性92
4.2.3图文混排94
4.3过程指导——使用HTML 5新增元素创建“灯塔漫画背景博客”96
4.3.1过程分析96
4.3.2步骤详解97
4.4自主任务——图像与文本的简单应用103
4.5习题104
第5章浮动、定位和列表106
5.1浮动106
5.1.1浮动的基本知识106
5.1.2清除浮动109
5.2定位110
5.2.1静态定位与固定定位110
5.2.2相对定位与绝对定位112
5.3列表115
5.3.1与列表相关的CSS属性115
5.3.2列表的图像修饰符116
5.3.3纵向导航118
5.3.4横向导航119
5.3.5图文信息列表121
5.4过程指导——“五月美食节专场”网页的设计与制作124
5.4.1过程分析124
5.4.2步骤详解124
5.5自主任务——“手机专卖网”的制作129
5.6习题130
第6章表格与表单131
6.1表格的创建与编辑131
6.1.1创建表格131
6.1.2单元格属性设置132
6.1.3单元格基本操作133
6.2CSS在表格中的应用135
6.2.1使用bordercollapse属性制作细线表格135
6.2.2使用伪类选择器制作隔行变色表格137
6.3表单的创建与编辑138
6.3.1表单域138
6.3.2常见表单对象140
6.4CSS在表单中的应用147
6.4.1文本域的美化147
6.4.2CSS 3按钮147
6.4.3搜索框的美化149
6.5过程指导——“Yuze App注册”页面的制作150
6.5.1过程分析150
6.5.2步骤详解150
6.6自主任务——“网站后台登录”页面的制作154
6.7习题155
第7章框架、模板与CSS 3新增布局156
7.1框架156
7.1.1基本概念156
7.1.2使用iframe元素创建框架页面157
7.2模板158
7.2.1模板是什么158
7.2.2使用模板快速创建页面158
7.2.3模板的修改162
7.3CSS 3多列布局163
7.3.1使用columns属性创建多列布局163
7.3.2多列布局的相关属性164
7.4CSS 3弹性盒布局166
7.4.1使用盒布局166
7.4.2弹性盒布局相关属性详解166
7.5适合移动设备的响应式布局172
7.5.1响应式布局172
7.5.2使用CSS 3的media query实现响应式布局172
7.6过程指导——制作适合多种设备终端显示的响应式页面176
7.6.1过程分析176
7.6.2步骤详解179
7.7自主任务——制作简单响应式页面185
7.8习题186
第8章行为与Spry构件187
8.1行为187
8.1.1事件与动作相关概念187
8.1.2“行为”面板188
8.1.3“弹出信息”行为189
8.1.4“打开浏览器窗口”行为190
8.1.5“改变属性”行为190
8.2Spry构件193
8.2.1Spry菜单栏193
8.2.2Spry选项卡式面板193
8.2.3Spry折叠式构件194
8.3过程指导——精品课程网站的设计与制作195
8.3.1过程分析196
8.3.2步骤详解196
8.4自主任务——精品课程网站主页的制作211
8.5习题212
第9章CSS进阶213
9.1CSS Sprite技术213
9.1.1CSS Sprite技术简述213
9.1.2CSS Sprite技术详解214
9.2CSS 3伪类选择器217
9.2.1:root、:not、:target和∷selection选择器217
9.2.2:firstchild、:lastchild和:onlychild选择器219
9.3CSS 3渐变220
9.4CSS 3过渡222
9.4.1transition属性简介222
9.4.2CSS 3过渡动画的实现223
9.5习题226
第10章站点测试、上传与维护227
10.1站点测试227
10.1.1浏览器兼容性测试227
10.1.2链接的测试228
10.2站点上传230
10.2.1注册域名230
10.2.2申请网站空间232
10.2.3内容上传233
10.3维护与推广238
10.3.1站点维护238
10.3.2网站推广239
10.4习题240
第11章综合案例解析——电子商务网站241
11.1电子商务网站的简易需求分析241
11.2电子商务网站的布局分析242
11.3实现过程245
11.3.1主页的实现245
11.3.2检索页的实现253
11.3.3产品信息页的实现256
11.4习题258
第12章实训指导260
12.1实训的意义和目的260
12.2实训要求与步骤261
12.3考核标准261
参考文献263

前沿

Dreamweaver CS6 HTML 5 CSS 3网页制作基础教程(微课版)目前，针对移动互联网开发领域的“Web前端工程师”可谓是热门抢手的岗位，通过仔细分析岗位描述可知，该岗位大多要求应聘者拥有“精通W3C规范，熟练掌握CSS、HTML等Web技术”“能够手写符合W3C标准的前端页面代码”等岗位技能。本书在紧密结合市场需求的前提下，以HTML 5和CSS 3的基础知识作为重点讲解对象，在W3C规范的指导下，将前端的思维模式融入每个知识点中，再配合免费的微课视频，使读者完全能够自主学习。
全书共分为12章，根据知识的难易程度和学习者的学习习惯，对HTML 5和CSS 3知识进行无缝衔接，使每章有理论，堂堂有案例，课后有实训。本书主要内容包括: 网页设计基础，HTML语言基础，Dreamweaver基础与CSS入门，文本与图像，浮动、定位和列表，表格与表单，框架、模板与CSS 3新增布局，行为与Spry构件，CSS进阶，站点测试、上传与维护，综合案例解析——电子商务网站以及实训指导。
本书具有以下特色。
 微课视频: 所有知识点均包含在许多短小的视频中，不受时空限制，扫描二维码就能预习或复习所学知识。
 贴近岗位: 本书涉及的内容均是互联网类岗位中必不可少的知识，通过学习读者能够获得岗位需求的基本能力。
 精选案例: 每章包含“过程指导”环节，通过精心挑选的实战案例，以及详略得当的过程指导，读者在学习过程中能够直观、清晰地看到操作过程和效果。
 自主任务: 每章包含“自主任务”环节，留出时间让读者参照“过程指导”进行实训练习。
 配套资源: 本书提供全套源文件、微课视频、PPT课件、课时授课计划和学期授课计划，读者可以从清华大学出版社网站（http: //www.tup.tsinghua.edu.cn）下载。
本书既可作为应用型本科以及各层次职业院校计算机相关专业的教材，也可作为IT类培训机构的网页设计培训教程。
本书的参考学时为60学时，为了方便教学，这里提供各章任务的学时分配，详见下表。第1章网页设计基础112第2章HTML语言基础246第3章Dreamweaver基础与CSS入门246第4章文本与图像246第5章浮动、定位和列表246第6章表格与表单224第7章框架、模板与CSS 3新增布局448第8章行为与Spry构件112第9章CSS进阶246第10章站点测试、上传与维护112第11章综合案例解析——电子商务网站134第12章实训指导0.57.58合计60本书由吴丰编著，在编写过程中，许多同仁给予了很大的帮助和支持，提出了许多中肯的建议，在此表示感谢。同时，还要感谢清华大学出版社的所有编审人员为本书的出版所付出的辛勤劳动。最后，还要感谢家人的理解和支持。本书的成功出版是大家共同努力的结果，谢谢你们！
另外，由于编著者水平有限，书中难免有不足之处，敬请广大读者批评、指正，以便修订时使之更加完善。诚心希望与读者共同交流、共同成长！
编著者联系方式: 413101130@qq.com。

编著者
2018年3月Dreamweaver CS6 HTML 5 CSS 3网页制作基础教程(微课版)

免费在线读

第3章

Dreamweaver基础与CSS入门【本章导读】
在工作中，常用Adobe Dreamweaver工具软件构建网站和应用程序，该工具提供可视化布局功能，开发者能够快速创建站点。本章除了介绍该款软件的使用方法外，还将向读者详细介绍工作中必不可少的CSS内容。
【学习目标】
熟悉Dreamweaver的工作环境；
了解站点及其相关知识，能够使用Dreamweaver创建和管理站点；
掌握CSS的基本语法，理解盒模型的内涵；
熟练掌握常用的CSS选择器，能够通过选择器修改指定对象的CSS规则。
3.1工作环境
Adobe Dreamweaver CS6是一个全面的专业工具集，可用于设计并部署极具吸引力的网站和Web应用程序。在编辑文档的状态下，Dreamweaver CS6的工作环境如图31所示，其中常用的区域含义如下。
图31Dreamweaver CS6的工作环境
(1) 文档工具栏: 该工具栏提供各种文档窗口视图，以及各种查看选项和方法。
(2) 代码视图: 用于编辑和查看当前编辑状态下的网页源代码。
(3) 设计视图: 用于可视化页面布局、可视化编辑，提供快速应用程序开发的设计环境。在该视图中，Dreamweaver显示的文档内容类似于在浏览器中查看页面时的效果。
(4) 属性面板: 用于查看和更改所选对象或文本的各种属性，每种对象都具有不同的属性，默认状态下该面板是折叠状态。
(5) 标签选择器: 用于显示环绕当前选定内容所在标签的层次结构。单击该层次结构中的任何标签，可以选择该标签及其全部内容。
(6) “文件”面板: 用于管理当前站点和本地的文件，类似于Windows资源管理器。
(7) “CSS样式”面板: 用于管理和编辑选定对象的CSS样式规则。
3.1.1文档和编码工具栏
Dreamweaver CS6包含了4种工具栏: 样式呈现、文档、标准、编码。用户可以通过执行“查看”→“工具栏”命令，打开或关闭某个工具栏。这里文档工具栏和编码工具栏较为常用，下面进行简单介绍。
Dreamweaver CS6 HTML 5 CSS 3网页制作基础教程(微课版)第3章Dreamweaver基础与CSS入门1. 文档工具栏
使用文档工具栏所包含的按钮可以在文档的不同视图之间进行快速切换。工具栏中还包含一些与查看文档、在本地和远程站点间传输文档有关的常用命令与选项，如图32所示。
图32文档工具栏
(显示代码视图): 单击该按钮后，文档窗口中仅显示页面的代码。
(显示代码视图和设计视图): 单击该按钮后，将文档窗口拆分为代码视图和设计视图。
(显示设计视图): 单击该按钮后，文档窗口中仅显示页面的设计界面，用户可以在此窗口中对网页元素直接编辑。
(实时视图): 显示不可编辑的、交互式的、基于浏览器的文档视图。
(多屏幕): 可以使设计师在多个设备屏幕大小不同的状态下预览当前页面。
(浏览器调试/预览): 在浏览器中预览或调试文档。
(文件管理): 弹出文件管理菜单。
(W3C验证): 方便设计师对当前页面在线验证是否符合W3C的标准。
(检查浏览器兼容性): 用于检查用户的CSS是否对于各种浏览器均兼容。
(可视化助理): 可以使用各种可视化助理来设计页面。
(刷新设计视图): 在代码视图中对文档进行更改后刷新文档的设计视图，可以使更改内容显示在设计视图中。
(文档标题): 在此输入的文字内容，将会作为网站标题出现在浏览器左上角。
2. 编码工具栏
编码工具栏垂直显示在文档窗口的左侧，它包含可用于执行多种标准编码操作的按钮，如图33所示。图33编码工具栏

(打开的文档): 显示当前打开的文档。
(显示代码导航): 显示代码导航器。
(折叠整个标签): 折叠一组标签之间的内容。
(折叠所选): 折叠所选代码。
(扩展全部): 还原所有折叠的代码。
(选择父标签): 选择当前标签的父标签。
(选取当前代码段): 选取当前代码段。
(行号): 显示或隐藏代码的行号。
(高亮无效代码): 用黄色显示无效代码。
(自动换行): 自动换行。
(语法错误警报): 启用或禁用语法错误警报。
(应用注释): 在所选代码两侧添加注释标签。
(删除注释): 删除注释。
(环绕标签): 在所选代码两侧自动添加某个标签。
(最近的代码片段): 从“代码片段”面板中插入代码。
(移动或转换CSS): 移动CSS位置，或转换CSS类别。
(缩进代码): 将选定内容向右移动。
(凸出代码): 将选定内容向左移动。
(格式化源代码): 将代码赋予标准格式。
3.1.2属性面板
显示属性面板的快捷键是Ctrl F3，用户可以通过该面板检查和编辑当前选定页面元素(如文本和插入的对象)最常用的属性。根据选定元素的不同，属性面板所呈现的属性也不尽相同，如图34和图35所示。
图34属性面板(选定对象为图像)
图35属性面板(选定对象为文本)
通过属性面板，用户能够快捷地修改、应用对象的基本属性，使用频率较高。
3.1.3常用面板介绍
Dreamweaver CS6为用户提供了可自由组合的多功能面板，大量操作可以快捷地通过面板迅速完成。
1. “插入”面板
显示或隐藏“插入”面板的快捷键是Ctrl F2。该面板包含用于创建和插入对象(如表格、图像和链接)，其中包含多种按钮。
这些按钮按9种类别进行组织。
（1） “常用”类别: 用于创建和插入最常用的对象，如图像和表格。
（2） “布局”类别: 用于插入表格、表格元素、

Dreamweaver CS6+HTML 5+CSS 3网页制作基础教程（微课版） pdf下载声明

本pdf资料下载仅供个人学习和研究使用，不能用于商业用途，请在下载后24小时内删除。如果喜欢，请购买正版

pdf下载地址

版权归出版社和作者所有，下载链接已删除。如果喜欢，请购买正版！

链接地址：Dreamweaver CS6+HTML 5+CSS 3网页制作基础教程（微课版）