HTML与CSS是网页制作技术的核心和基础,也是每个网页制作者必须要掌握的基本知识,两者在网页设计中不可或缺。本书从初学者的角度,以形象的比喻、实用的案例、通俗易懂的语言详细介绍了使用HTML与CSS(包括HTML5和CSS3)进行网页设计与制作的各方面内容和技巧。
全书共11章,第1到3章主要讲解了HTML与CSS的基础知识,包括Web基本概念、HTML与CSS简介、Dreamweaver工具的使用、HTML文本与图像标记、CSS选择器、CSS文本样式属性、CSS的继承性/优先级以及HTML5和CSS3的新特性。第4到9章分别讲解了盒子模型、列表与超链接、表格与表单、元素的浮动与定位、音频与视频的嵌入、过渡、变形、动画等,它们是学习网页制作的核心。第10章主要讲解了CSS的高级技巧、布局与常见的兼容性,掌握这些实用的技巧,可以使初学者在制作网页时得心应手。第11章为实战开发,结合前面学习的基础知识,带领初学者开发一个电商网站的首页面。
本书附有配套视频、源代码、习题、教学课件等资源,而且为了帮助初学者更好地学习本书讲解的内容,还提供了在线答疑,希望得到更多读者的关注。
本书既可作为高等院校本、专科相关专业的网页设计与制作课程的教材,也可作为网页平面设计的培训教材,是一本适合网页制作、美工设计、网站开发、网页编程等行业人员阅读与参考的优秀读物。
本书既可作为高等院校本、专科计算机相关专业的专用教材,也可以作为技术爱好者的入门用书。
HTML与CSS是网页制作技术的核心和基础,也是每个网页制作者必须要掌握的基本知识,两者在网页设计中不可或缺。本书从初学者的角度,以形象的比喻、实用的案例、通俗易懂的语言详细介绍了使用HTML与CSS进行网页设计与制作的各方面内容和技巧。
本书是在第一版《网页设计与制作(HTML+CSS)》的基础上修订而成,关于本书的修订工作说明如下。
1.
增加了HTML5部分基础标签和CSS3新属性的讲解和应用。
2.
增加了网页视听技术的应用,主要包括音频、视频的嵌入和动画效果。
3.
全面审核并修改第一版中的不妥之处,并替换了原书中较为陈旧的案例和图片。
第1章 HTML和CSS网页制作概述 1.1 网页概述 1.1.1 网页的构成 1.1.2 网页相关名词 1.1.3 Web标准 1.2 网页制作技术 1.2.1 HTML简介 1.2.2 CSS简介 1.3 网页展示平台 1.4 网页代码编辑工具 1.4.1 Dreamweaver操作界面 1.4.2 Dreamweaver初始化设置 1.4.3 创建第一个网页 1.5 本章小结 第2章 HTML入门 2.1 HTML概述 2.1.1 HTML文档格式 2.1.2 HTML标签 2.2 HTML文本控制标签 2.2.1 页面格式化标签 2.2.2 文本样式标签 2.2.3 文本格式化标签 2.2.4 特殊字符 2.3 HTML图像应用 2.3.1 常用图像格式 2.3.2 图像标签<img /> 2.3.3 绝对路径和相对路径 2.4 阶段案例—制作图文混排页面 2.4.1 分析效果图 2.4.2 制作页面结构 2.4.3 控制图像 2.4.4 控制文本 2.5 本章小结 第3章 CSS入门 3.1 CSS核心基础 3.1.1 CSS样式规则 3.1.2 CSS样式引入 3.1.3 CSS基础选择器 3.2 CSS文本样式属性 3.2.1 CSS字体样式属性 3.2.2 CSS文本外观属性 3.3 CSS高级特性 3.3.1 CSS复合选择器 3.3.2 CSS层叠性和继承性 3.3.3 CSS优先级 3.4 阶段案例—制作新闻页面 3.4.1 分析效果图 3.4.2 制作页面结构 3.4.3 定义CSS样式 3.5 本章小结 第4章 盒子模型 4.1 认识盒子模型 4.2 盒子模型的相关属性 4.2.1 边框属性 4.2.2 内边距属性 4.2.3 外边距属性 4.2.4 背景属性 4.2.5 盒子的宽与高 4.3 CSS3新增盒子模型属性 4.3.1 颜色透明度 4.3.2 圆角 4.3.3 图片边框 4.3.4 阴影 4.3.5 渐变 4.3.6 多背景图像 4.3.7 修剪背景图像 4.4 元素的类型和转换 4.4.1 元素的类型 4.4.2 div和span 4.4.3 元素类型的转换 4.5 块元素垂直外边距的合并 4.5.1 相邻块元素垂直外边距的合并 4.5.2 嵌套块元素垂直外边距的合并 4.6 阶段案例——制作音乐排行榜 4.6.1 分析效果图 4.6.2 制作页面结构 4.6.3 定义CSS样式 4.7 本章小结 第5章 列表和超链接 5.1 列表标签 5.1.1 无序列表 5.1.2 有序列表 5.1.3 定义列表 5.1.4 列表的嵌套应用 5.2 CSS控制列表样式 5.2.1 list-style-type属性 5.2.2 list-style-image属性 5.2.3 list-style-position属性 5.2.4 list-style属性 5.3 超链接标签 5.3.1 创建超链接 5.3.2 锚点链接 5.4 链接伪类控制超链接 5.5 阶段案例—制作新闻列表 5.1.1 分析效果图 5.1.2 制作页面结构 5.1.3 定义CSS样式 5.6 本章小结 第6章 表格和表单 6.1 表格 6.1.1 创建表格 6.1.2 <table>标签的属性 6.1.3 <tr>标签的属性 6.1.4 <td>标签的属性 6.1.5 <th>标签及其属性 6.1.6 表格的结构 6.2 CSS控制表格样式 6.2.1 CSS控制表格边框 6.2.2 CSS控制单元格边距 6.2.3 CSS控制单元格的宽高 6.3 表单 6.3.1 表单的构成 6.3.2 创建表单 6.4 表单控件 6.4.1 input控件 6.4.2 textarea控件 6.4.3 select控件 6.5 HTML5表单新属性 6.5.1 全新的form属性 6.5.2 全新的表单控件 6.5.3 全新的input控件类型 6.5.4 全新的input属性 6.6 CSS控制表单样式 6.7 阶段案例—制作表单注册页面 6.7.1 效果分析 6.7.2 搭建结构 6.7.3 定义样式 6.8 本章小结 第7章 网页布局 7.1 网页布局概述 7.2 网页布局常用属性 7.2.1 标签的浮动属性 7.2.2 标签的定位属性 7.3 网页布局其他属性 7.3.1 overflow属性 7.3.2 Z-index标签层叠 7.4 布局类型 7.4.1 单列布局 7.4.2 两列布局 7.4.3 三列布局 7.4.4 全新的html5结构元素 7.4.5 网页模块命名规范 7.5 阶段案例——制作通栏banner 2.1.1 分析效果图 7.5.1 制作页面结构 7.5.2 定义CSS样式 7.6 本章小结 第8章 视频和音频 8.1 视频音频嵌入技术概述 8.2 视频文件和音频文件的格式 8.3 嵌入视频和音频 8.3.1 在HTML5中嵌入视频 8.3.2 在HTML5中嵌入音频 8.3.3 视频音频文件的兼容性问题 8.3.4 调用网络音频视频文件 8.4 CSS控制视频的宽高 8.5 阶段案例—制作音乐播放界面 8.5.1 分析效果图 8.5.2 制作页面结构 8.5.3 定义CSS样式 8.6 本章小结 第9章 过渡、变形和动画 9.1 过渡 9.1.1 transition-property属性 9.1.2 transition-duration属性 9.1.3 transition-timing-function属性 9.1.4 transition-delay属性 9.1.5 transition属性 9.2 变形 9.2.1 认识transform 9.2.2 2D变形 9.2.3 3D变形 9.3 动画 9.3.1 @keyframes 9.3.2 animation-name属性 9.3.3 animation-duration属性 9.3.4 animation-timing-function属性 9.3.5 animation-delay属性 9.3.6 animation-iteration-count属性 9.3.7 animation-direction属性 9.3.8 animation属性 9.4 阶段案例——制作表情图片 9.4.1 分析效果图 9.4.2 制作页面结构 9.4.3 定义CSS样式 9.5 本章小结 第10章 网页制作应用技巧 10.1 CSS精灵技术 10.1.1 认识CSS精灵 10.1.2 应用CSS精灵 10.2 滑动门技术 10.2.1 认识滑动门 10.2.2 应用滑动门 10.3 margin负值设置技巧 10.3.1 margin负值的应用 10.3.2 利用margin负值制作压线效果 10.4 本章小节 第11章 实战开发—电商网站首页 11.1 准备工作 11.2 首页面详细制作 1. 制作头部、导航及视频内 2. 制作内容部分(新品) 3. 制作内容部分(试装) 4. 制作内容部分(评测) 5. 注册信息和版权信息部分 11.3 本章小结