思维导图备注

移动Web前端高效开发实战——HTML 5_CSS 3_JavaScript_Webpack_React Native_Vue.js_Node.js - iKcamp
首页 收藏书籍 阅读记录
  • 书签 我的书签
  • 添加书签 添加书签 移除书签 移除书签

第7章　移动网页样式布局实战

浏览 1 扫码
  • 小字体
  • 中字体
  • 大字体
2024-04-30 10:05:11
请 登录 再阅读
上一篇:
下一篇:
  • 书签
  • 添加书签 移除书签
  • 封面
  • 版权信息
  • 内容简介
  • 前言
  • 第1章　初识移动Web前端
    • 1.1　移动Web前端史
      • 1.1.1　Web开发的变迁
      • 1.1.2　移动Web与HTML 5不得不说的关系
      • 1.1.3　移动Web与原生应用的优劣势
    • 1.2　移动Web前端现状与未来
      • 1.2.1　移动Web的现状
      • 1.2.2　您需要掌握的知识体系
      • 1.2.3　技术拐点与未来趋势
    • 1.3　常见问题
      • 1.3.2　PC Web和移动Web开发区别
    • 1.4　本章小结
  • 第2章　移动Web开发环境搭建
    • 2.1　Visual Studio Code免费跨平台编辑器
    • 2.2　使用Node.js
      • 2.2.1　Node.js的用途
      • 2.2.2　安装和调试Node.js
      • 2.2.3　什么是NPM
      • 2.2.4　Web代理工具NProxy
      • 2.2.5　HTTP服务器http-server
    • 2.3　本章小结
  • 第3章　HTML 5必会实际常用特性
    • 3.1　新的语义
      • 3.1.1　新元素的到来
      • 3.1.2　表单的增强应用
      • 3.1.3　使用音频和视频
    • 3.2　访问你的设备
      • 3.2.1　定位当前地埋位置
      • 3.2.2　实战演练：调用摄像头拍个照
      • 3.2.3　实战演练：在手机上实现摇一摇
    • 3.3　离线和存储
      • 3.3.1　实战演练：搭建一个简单的离线应用
      • 3.3.2　离线之后资源该如何更新——Service Worker
      • 3.3.3　LocalStorage与SessionStorage
      • 3.3.4　实战演练：利用IndexedDB实现便签管理
    • 3.4　图像效果
      • 3.4.1　使用Canvas绘制一个简单的饼图
      • 3.4.2　使用SVG实现奥运五环
      • 3.4.3　WebGL带来了3D图像功能
    • 3.5　不一样的通信
      • 3.5.2　XMLHttpRequest Level 2
      • 3.5.3　Server Sent Event
      • 3.5.4　WebSocket
      • 3.5.5　WebRTC
    • 3.6　其他常用特性
      • 3.6.2　Drag和Drop介绍
      • 3.6.3　利用Web Workers加速应用计算
      • 3.6.4　利用Performance API分析网站性能
    • 3.7　本章小结
  • 第4章　CSS 3必会实战技巧
    • 4.1　认识CSS 3
      • 4.1.1　什么是CSS 3
      • 4.1.2　移动Web的CSS 3现状
      • 4.1.3　用Modernizr检测浏览器是否支持CSS 3
    • 4.2　选择器
      • 4.2.1　常见选择器
      • 4.2.2　伪类和伪元素
      • 4.2.3　优先级和权重
    • 4.3　响应式开发
      • 4.3.1　常见设备的宽高
      • 4.3.2　Flex弹性盒布局
      • 4.3.3　媒体查询（Media Query）
      • 4.3.4　用rem开发响应式设计
      • 4.3.5　多列（Multiple Columns）
    • 4.4　动效
      • 4.4.2　过渡（Transition）
      • 4.4.3　动画（Animation）
    • 4.5　常用特性
      • 4.5.1　开放字体格式（WOFF）
      • 4.5.2　背景（Backgrounds）
      • 4.5.3　颜色（Color）
      • 4.5.4　文字效果（Text Effects）
      • 4.5.5　边框（Border）
    • 4.6　预编译
      • 4.6.1　Less介绍和安装
      • 4.6.2　Less使用
      • 4.6.3　Sass介绍和安装
      • 4.6.4　Sass使用
      • 4.6.5　Compass的安装和使用
    • 4.7　本章小结
  • 第5章　JavaScript关键语法及使用技巧
    • 5.1　理解JavaScript
      • 5.1.1　语言基础
      • 5.1.2　函数和参数
    • 5.2　事件
      • 5.2.2　事件委托
      • 5.2.3　移动端事件
    • 5.3　作用域、闭包和this
      • 5.3.2　闭包
      • 5.3.3　采用call、apply、bind改变this
    • 5.4　面向对象
      • 5.4.1　原型和原型链
      • 5.4.2　Mixin模式
      • 5.4.3　ECMAScript 6的Class和Extends
    • 5.5　异步编程
      • 5.5.1　AJAX中的Callback回调函数
      • 5.5.2　Promise模式
      • 5.5.3　生成器Generator
    • 5.6　模块化
      • 5.6.1　为什么需要模块化
      • 5.6.2　AMD和CMD规范
      • 5.6.3　ECMAScript 6标准的模块支持
    • 5.7　ECMAScript 6其他常用功能
      • 5.7.1　基础数据类型的扩展
      • 5.7.2　使用解构赋值来简化代码
      • 5.7.3　使用Babel插件提前使用新特性
    • 5.8　本章小结
  • 第6章　HTML 5移动开发实战
    • 6.1　在地图上显示行走轨迹
    • 6.2　仿原生相册
      • 6.2.1　实现相册初始展示页
      • 6.2.2　通过手势操作控制相片
    • 6.3　使用Socket.IO制作小型聊天室
      • 6.3.1　前端HTML+JavaScript实现聊天界面
      • 6.3.2　服务器端Node.js监听连接
    • 6.4　移动端拍照上传实践
      • 6.4.1　前端HTML+CSS+JavaScript
      • 6.4.2　服务器端Node.js
    • 6.5　利用Microdata进行SEO优化
      • 6.5.1　认识Microdata
      • 6.5.2　提升网页SEO效果
    • 6.6　制作一个带字幕的视频播放器
    • 6.7　使用Pixi.js制作“抓住开学君”游戏（Canvas+WebGL）
    • 6.8　用Canvas制作刮刮卡
    • 6.9　实战演练：实现3D全景效果
      • 6.9.1　需要的CSS 3特性
      • 6.9.2　实现原理
      • 6.9.3　实现代码
    • 6.10　本章小结
  • 第7章　移动网页样式布局实战
    • 7.1　静态布局的实际应用
      • 7.1.1　设计活动页面静态布局
      • 7.1.2　静态布局在移动端上的自适应
    • 7.2　水平居中与垂直居中实战
      • 7.2.1　水平居中
      • 7.2.2　自适应块级元素水平居中
      • 7.2.3　行内元素垂直居中
      • 7.2.4　块级元素的垂直居中
      • 7.2.5　基于视口单位的解决方案
      • 7.2.6　基于Flexbox的解决方案
    • 7.3　栅格系统实现响应式列表
      • 7.3.1　实现栅格布局
      • 7.3.2　栅格布局的原理
    • 7.4　Flex多栏布局实战
    • 7.5　实战演练：沪江网校首页rem布局实践
    • 7.6　实战演练：侧边栏的滑进滑出效果
    • 7.7　实战演练：模拟原生的页面切换效果
      • 7.7.1　实现页面切换过渡效果
      • 7.7.2　模拟切换原理解析
    • 7.8　提高Web动画的性能实战
      • 7.8.1　使用CSS 3动画
      • 7.8.2　使用高性能的JavaScript动画
    • 7.9　实战演练：课程分类列表实战
      • 7.9.1　实现主页结构
      • 7.9.2　响应式CSS实现（Compass）
      • 7.9.3　添加页面动态效果
    • 7.10　本章小结
  • 第8章　前端工程化实战
    • 8.1　前端工程化
      • 8.1.1　前端工程化的必要性
      • 8.1.2　前端工程化的发展史
    • 8.2　工程化入门Grunt
      • 8.2.1　安装和配置
      • 8.2.2　Grunt插件
      • 8.2.3　实战演练：使用Grunt开发一个简易相册
    • 8.3　使用Gulp构建一个ECMAScript 6和Sass应用
      • 8.3.1　安装和配置
      • 8.3.2　预处理任务
      • 8.3.3　实战演练：采用ECMAScript 6开发一个Markdown编辑器
      • 8.3.4　代码检查任务
      • 8.3.5　代码合并、压缩、重命名任务
      • 8.3.6　监听文件变化自动构建
    • 8.4　实战演练：使用Webpack构建一个React应用
      • 8.4.1　安装和配置
      • 8.4.2　常用的加载器和插件
      • 8.4.3　缓存控制
      • 8.4.4　简化模块引用
      • 8.4.5　异步模块加载
      • 8.4.6　使用Source Map调试代码
    • 8.5　本章小结
  • 第9章　移动Web常用开发方式实战
    • 9.1　基于DOM的开发方式
      • 9.1.1　使用Zepto和前端模板开发简单备忘录
      • 9.1.2　解决原生单击事件的缺陷
      • 9.1.3　为何抛弃掉Zepto
    • 9.2　基于React的开发方式
      • 9.2.1　使用JSX语法创建React组件
      • 9.2.2　在实践中掌握React生命周期
      • 9.2.3　实现组件间通信
      • 9.2.4　实现组件关注分离
      • 9.2.5　实战演练：运用组件化方式开发一个备忘录
      • 9.2.6　如何管理应用的状态
      • 9.2.7　添加动画效果
      • 9.2.8　提高React组件性能
    • 9.3　基于Vue.js的开发方式
      • 9.3.1　实战演练：开发一个简单的备忘录应用（Vue.js 2.0）
      • 9.3.2　管理应用的状态及实现组件间的通信
      • 9.3.3　添加动画效果
    • 9.4　打造单页应用SPA
      • 9.4.1　单页应用的优势是什么
      • 9.4.2　实战演练：实现一个单页路由
      • 9.4.3　实战演练：使用React开发一个简单的单页应用
      • 9.4.4　单页应用的状态管理
    • 9.5　本章小结
  • 第10章　混合式开发实战
    • 10.1　为什么需要混合式开发
      • 10.1.1　混合式开发种类
      • 10.1.2　混合式开发的优势
      • 10.1.3　选择合适的混合式开发方案
    • 10.2　Cordova开发入门
      • 10.2.1　JavaScript和Native互相调用
      • 10.2.2　Cordova介绍和安装
      • 10.2.3　Cordova开发使用
    • 10.3　React Native实战
      • 10.3.2　React Native样式和布局
      • 10.3.3　React Native组件概念
      • 10.3.4　简单组件实战
      • 10.3.5　复合组件实战
      • 10.3.6　第三方组件实战
      • 10.3.7　常用API实践
    • 10.4　实战演练：用React Native开发新闻阅读应用
      • 10.4.1　React Native的工程项目结构一览
      • 10.4.2　列表页
      • 10.4.3　新闻评论页
      • 10.4.4　新闻展示页
    • 10.5　本章小结
  • 第11章　前端开发调试实战
    • 11.1　浏览器调试
      • 11.1.1　Chrome开发者工具
      • 11.1.2　Safari开发者工具
    • 11.2　代理工具
      • 11.2.1　Mac OS下Charles的用法
      • 11.2.2　Windows下Fiddler的用法
    • 11.3　多终端同步工具
      • 11.3.1　多设备浏览器同步测试工具BrowserSync
      • 11.3.2　双向自动刷新样式工具Emmet LiveStyle
    • 11.4　模拟器调试
      • 11.4.1　Android模拟器调试
      • 11.4.2　iOS模拟器调试
      • 11.4.3　在线模拟器Manymo
    • 11.5　多平台调试
      • 11.5.1　网站响应式设计测试工具Ghostlab
      • 11.5.2　移动端Web开发调试工具Weinre
      • 11.5.3　JavaScript远程调试和测试工具Vorlon.JS
    • 11.6　云真机调试
      • 11.6.1　浏览器兼容性云端测试应用BrowserStack
      • 11.6.2　Web端移动设备管理控制工具STF
      • 11.6.3　多浏览器兼容性测试平台F2etest
    • 11.7　React调试
      • 11.7.2　Redux DevTools
    • 11.8　本章小结
  • 第12章　前端单元测试实战
    • 12.1　JavaScript单元测试框架Jasmine实战
    • 12.2　使用Mocha和Chai在Node.js进行单元测试
    • 12.3　使用Sinon辅助单元测试
    • 12.4　使用Karma自动化单元测试
    • 12.5　使用Istanbul计算代码覆盖率
    • 12.6　使用Benchmark.js进行基准测试
    • 12.7　实战演练：React版备忘录项目的完整单元测试
    • 12.8　本章小结
  • 第13章　前端性能优化实战
    • 13.1　常用网站性能优化指标
      • 13.1.1　网页的资源请求与加载阶段
      • 13.1.2　网页渲染阶段
      • 13.1.3　JavaScript脚本的执行速度
    • 13.2　依旧有效的Yahoo性能优化法则
    • 13.3　性能优化工具使用实战
      • 13.3.1　YSlow
      • 13.3.2　PageSpeed
      • 13.3.3　WebPagetest
    • 13.4　HTTP协议头缓存实战
      • 13.4.1　客户端缓存流程
      • 13.4.2　缓存协议内容
      • 13.4.3　实战演练：HTTP缓存
    • 13.5　资源按需加载实战
      • 13.5.2　基于Webpack的按需加载
      • 13.5.3　图片懒加载
    • 13.6　不同网络类型的优化实战
      • 13.6.2　弱网图片优化
      • 13.6.3　弱网缓存优化
    • 13.7　实战演练：Nginx配置Combo合并HTTP请求
      • 13.7.1　安装Nginx和文件合并模块
      • 13.7.2　配置Nginx和Combo
    • 13.8　本章小结
  • 第14章　项目实战：搭建直播平台（Cordova+Koa+React）
    • 14.1　项目的安装和启动
      • 14.1.1　安装依赖
      • 14.1.2　启动项目
      • 14.1.3　Cordova打包
    • 14.2　直播平台功能预览
      • 14.2.1　直播流程
      • 14.2.2　直播核心页面
    • 14.3　页面的布局和结构
      • 14.3.1　首页
      • 14.3.2　发起直播页面
      • 14.3.3　观看直播页面
    • 14.4　搭建WebRTC服务端——Koa
    • 14.5　实现多人在线直播功能
    • 14.6　实现弹幕客户端与服务端通信
      • 14.6.1　客户端与服务端通信的过程
      • 14.6.2　客户端代码设计——React
      • 14.6.3　服务端代码设计
    • 14.7　本章小结
暂无相关搜索结果！
    展开/收起文章目录

    二维码

    手机扫一扫，轻松掌上学

    《移动Web前端高效开发实战——HTML 5_CSS 3_JavaScript_Webpack_React Native_Vue.js_Node.js - iKcamp》电子书下载

    请下载您需要的格式的电子书，随时随地，享受学习的乐趣！
    EPUB 电子书

    书签列表

      阅读记录

      阅读进度: 0.00% ( 0/0 ) 重置阅读进度