logo
分类于: 计算机基础 人工智能 设计 职场办公

简介

构建跨平台APP: 响应式UI设计入门

构建跨平台APP: 响应式UI设计入门 0.0分

资源最后更新于 2020-03-29 01:05:30

作者:杨旺功赵荣娇

出版社:出版社清华大学出版社

出版日期:2016-07

文件格式: pdf

标签: 计算机 程序设计 应用程序 移动终端 人机界面

简介· · · · · ·

基于“响应式内容”的本质,页面应该在任何合理屏幕大小的设备上看上去都很舒服,我们做设计的就应该站在用户的角度考虑,一切设计都应该看上去很美、很实用。本书的响应式设计正是基于这一理念,从小到一个图标,大到完整的页面布局,都从响应式UI设计入手,适合所有响应式设计的入门人员和中小企业的网站搭建人员学习。杨旺功,男,毕业于重庆邮电大学,硕士。现任北京印刷学院设计艺术学院教师,主要研究方向是信息与交互设计产品创新设计,具有丰富的数字媒体交互产品设计和移动应用UI设计的教学经验。在数字化艺术与设计领域成果显著,发表多篇数字化艺术与设计的论文,对信息与交互设计有深入的研究。赵荣娇,女,毕业于中国传媒大学,硕士。中国传媒大学新媒体研究院主办《信息科技周刊》总编辑,《新媒体技术动态》发起人。目前就职于阿里去啊,担任前端开发工程师,曾参与旅游特卖首页、1688订单等项目开发。热爱技术,喜欢分享。

想要: 点击会收藏到你的 我的收藏,可以在这里查看

已收: 表示已经收藏

Tips: 注册一个用户 可以通过用户中心得到电子书更新的通知哦

目录

  1. 前言
  2. 第1章 传说中的响应式设计
  3. 1.1 支持跨平台设备的响应式设计
  4. 1.1.1 什么样的设计是响应式的
  5. 1.1.2 响应式设计坚守的4大原则
  6. 1.2 响应式设计与其他页面设计的对比
  7. 1.2.1 固定布局
  8. 1.2.2 流式布局
  9. 1.3 实战:创建一个响应式网页
  10. 1.3.1 设置HTML文档的Meta标签
  11. 1.3.2 设计HTML文档结构
  12. 1.3.3 使用CSS 3媒介查询
  13. 1.3.4 运行第一个响应式页面
  14. 1.4 小结
  15. 第2章 响应式网页中的元素
  16. 2.1 文字
  17. 2.2 表单
  18. 2.2.1 自定义Radiobox
  19. 2.2.2 自定义Checkbox动画
  20. 2.2.3 美化输入框
  21. 2.2.4 下拉框
  22. 2.3 框架
  23. 2.3.1 传统的iFrame框架
  24. 2.3.2 响应式的iFrame框架
  25. 2.4 实战:实现一个响应式登录表单
  26. 2.4.1 设置登录表单的HTML结构
  27. 2.4.2 设计登录表单的通用样式
  28. 2.4.3 使用CSS 3媒介查询实现响应式登录表单
  29. 2.5 小结
  30. 第3章 响应式布局
  31. 3.1 布局切换
  32. 3.2 侧边栏
  33. 3.3 宽高等比例变化
  34. 3.4 列表
  35. 3.4.1 定义列表分级菜单
  36. 3.4.2 列表切换效果
  37. 3.5 表格
  38. 3.5.1 简单自适应表格
  39. 3.5.2 翻转滚动表格
  40. 3.5.3 隐藏表格栏目
  41. 3.6 实战:响应式商品展示列表
  42. 3.7 小结
  43. 第4章 响应式导航
  44. 4.1 响应式导航菜单设计五大原则
  45. 4.1.1 按照优先级显示内容
  46. 4.1.2 用创造力来处理有限的空间
  47. 4.1.3 下拉菜单
  48. 4.1.4 给导航菜单换位置
  49. 4.1.5 放弃导航菜单
  50. 4.2 导航类型
  51. 4.2.1 单层导航
  52. 4.2.2 多层导航
  53. 4.2.3 面包屑导航
  54. 4.3 页码设计
  55. 4.4 小结
  56. 第5章 响应式多媒体
  57. 5.1 图标的响应式
  58. 5.2 图像
  59. 5.2.1 可适配的图像
  60. 5.2.2 图像网格
  61. 5.3 视频
  62. 5.3.1 内嵌视频响应式的难点
  63. 5.3.2 从其他网站中手动嵌入视频
  64. 5.4 响应式图表
  65. 5.4.1 一款响应式图表库
  66. 5.4.2 带Tooltip提示的线形图
  67. 5.4.3 简单的饼图
  68. 5.5 小结
  69. 第6章 Bootstrap入门
  70. 6.1 初次接触Bootstrap
  71. 6.1.1 Bootstrap的优势
  72. 6.1.2 下载Bootstrap
  73. 6.2 在网站中引入Bootstrap
  74. 6.3 调用Bootstrap的样式
  75. 6.4 调用Bootstrap的组件
  76. 6.5 调用Bootstrap的js特效
  77. 6.6 实战:一个Bootstrap实现的响应式页面V1.0
  78. 6.7 小结
  79. 第7章 Bootstrap的样式设计
  80. 7.1 字体
  81. 7.1.1 标题
  82. 7.1.2 全局字体和段落
  83. 7.2 表格
  84. 7.2.1 基本用法
  85. 7.2.2 表格的附加样式
  86. 7.2.3 为表格行或单元格添加状态标识
  87. 7.2.4 响应式表格
  88. 7.3 表单
  89. 7.4 按钮
  90. 7.4.1 按钮的基本样式
  91. 7.4.2 调节按钮大小
  92. 7.4.3 块级按钮
  93. 7.4.4 为按钮设置不可点击样式
  94. 7.5 图片
  95. 7.5.1 图片类
  96. 7.5.2 响应式图片
  97. 7.6 Bootstrap工具类
  98. 7.6.1 响应式工具 
  99. 7.6.2 工具类
  100. 7.7 实战:Bootstrap响应式页面V2.0
  101. 7.8 小结
  102. 第8章 Bootstrap的组件设计
  103. 8.1 下拉菜单
  104. 8.2 按钮组
  105. 8.2.1 垂直排列的按钮组
  106. 8.2.2 两端对齐的按钮组
  107. 8.2.3 嵌套按钮组
  108. 8.3 input控件组
  109. 8.3.1 最常见的搜索框
  110. 8.3.2 带提示的搜索框
  111. 8.4 导航
  112. 8.4.1 胶囊式导航
  113. 8.4.2 面包屑导航
  114. 8.4.3 头部导航
  115. 8.5 列表组
  116. 8.6 分页
  117. 8.6.1 普通的分页
  118. 8.6.2 上一页/下一页
  119. 8.7 标签
  120. 8.8 面板
  121. 8.9 进度条
  122. 8.10 缩略图
  123. 8.11 实战:Bootstrap响应式页面V3.0
  124. 8.12 小结
  125. 第9章 Bootstrap的特效设计
  126. 9.1 模态对话框
  127. 9.2 标签页切换
  128. 9.3 Tootip
  129. 9.4 弹出框
  130. 9.5 折叠
  131. 9.6 幻灯片
  132. 9.7 实战:Bootstrap响应式页面V4.0
  133. 9.8 小结
  134. 第10章 使用Bootstrap实现一个百度贴吧后台
  135. 10.1 确定后台管理的需求
  136. 10.2 设计页面布局
  137. 10.2.1 引入Bootstrap 3框架
  138. 10.2.2 实现页面布局代码
  139. 10.3 设计导航栏
  140. 10.3.1 构建导航的整体架构
  141. 10.3.2 设计标题和导航链接
  142. 10.3.3 实现搜索框和通知系统
  143. 10.3.4 实现管理员的登录信息
  144. 10.3.5 构建响应式导航
  145. 10.4 设计左侧边栏
  146. 10.5 设计主功能部分
  147. 10.5.1 主功能的头部
  148. 10.5.2 主功能的帖子列表
  149. 10.6 小结
  150. 第11章 使用HTML 5设计扁平化的公司主页
  151. 11.1 响应式设计的关键
  152. 11.2 导航栏的设计
  153. 11.2.1 列表的实现
  154. 11.2.2 弹出式菜单的实现
  155. 11.3 主功能部分的设计
  156. 11.3.1 什么是视差滚动效果
  157. 11.3.2 视差效果的实现
  158. 11.3.3 图文列表的实现
  159. 11.4 小结
  160. 附录 CSS 3选择器使用一览
  161. f1.1 标签选择器
  162. f1.2 类选择器
  163. f1.3 id选择器
  164. f1.4 通配符选择器
  165. f1.5 子元素选择器
  166. f1.6 后代元素选择器
  167. f1.7 相邻元素选择器
  168. f1.8 属性选择器
  169. f1.9 组选择器
  170. f1.10 复合选择器
  171. f1.11 结构化伪类
  172. f1.12 目标伪类:target
  173. f1.13 状态伪类
  174. f1.14 否定伪类:not(S)