资深Web开发工程师亲笔撰写,网站广泛好评,完全掌握下一代设备和浏览器技术的必备指南;从准备工作、实现方式和工作原理三方面,通过大量真实示例,全面而系统地讲解HTML5和CSS3响应式Web设计与开发的各种实用技术和技巧。
移动互联网时代到来了。《Web开发技术丛书·响应式Web设计:HTML5和CSS3实践指南》将当前web设计中热门的响应式设计技术与html5和css3结合起来,为读者全面深入地讲解了针对各种屏幕大小设计和开发现代网站的各种技术。不仅讨论了媒体查询、流式布局、相对字体、响应式媒体,更将html5和css3的相关知识点一并讲解,是学习最新web设计技术不可多得的佳作。
译者序
作者简介
审校者简介
前言
第1章 响应式元素及媒介
1.1 简介
1.2 基于宽度百分比的图像缩放
1.3 基于cookie及JavaScript的响应式图像
1.4 使视频自适应于屏幕宽度
1.5 基于媒介查询的图像缩放
1.6 基于媒介查询的动态导航栏
1.7 基于尺寸的响应式内边距
1.8 基于CSS3按钮的进度条
第2章 响应式字体
2.1 简介
2.2 创建自适应的响应式字体
2.3 使用画布实现文本阴影
2.4 使用画布实现内侧阴影和外侧阴影
2.5 使用画布旋转文本
2.6 使用CSS3旋转文本
2.7 使用CSS3制作3D文本
2.8 基于文本遮罩的文本纹理
2.9 基于位置伪类的交替行样式
2.10 基于before及after伪元素添加字符
2.11 基于相对字体大小的按钮
2.12 为字体添加阴影效果
2.13 基于边框半径的圆角实现
第3章 响应式布局
3.1 简介
3.2 基于min-width和max-width属性的响应式布局
3.3 基于相对内边距的布局控制
3.4 为CSS添加媒介查询
3.5 基于媒介查询创建响应式宽度布局
3.6 基于媒介查询改变图片大小
3.7 基于媒介查询隐藏元素
3.8 创建平滑过渡的响应式布局
第4章 使用响应式框架
4.1 简介
4.2 使用流式960网格布局
4.3 使用Blueprint网格布局
4.4 基于三分法的流式布局
4.5 响应式960网格框架—Gumby
4.6 易上手的Bootstrap框架
第5章 设计移动设备优先的Web应用
5.1 简介
5.2 使用Safari开发者工具的用户代理设置
5.3 通过Chrome插件设置用户代理
5.4 使用插件调整浏览器窗口大小
5.5 学习视窗及其相关选项
5.6 为jQuery Mobile添加标签
5.7 基于jQuery Mobile添加子页面
5.8 基于jQuery Mobile制作列表元素
5.9 基于jQuery Mobile开发具有移动设备外观的按钮
5.10 仅通过媒介查询为移动设备设置移动版本的样式表
5.11 仅为移动设备添加JavaScript功能特效
第6章 优化响应式内容
6.1 简介
6.2 使用IE开发者工具进行响应式测试
6.3 浏览器测试—使用插件
6.4 开发环境—使用免费IDE
6.5 虚拟化—下载VirtualBox
6.6 在Chrome中使用浏览器缩放工具
第7章 非侵入式JavaScript
7.1 简介
7.2 基于非侵入式JavaScript编写“Hello World”
7.3 基于事件监听器创建发光效果的“提交”按钮
7.4 制作鼠标悬停后的按钮突出效果
7.5 基于非侵入式jQuery改变页面元素大小
7.6 基于非侵入式JavaScript的密码遮罩
7.7 基于事件监听器实现图像阴影的动态效果