随着各类移动终端设备的普及 之前针对PC端设计的网站已经无法满足用户的需求 响应式网页设计的概念应运而生。无论用户使用笔记本还是iPad 页面都应该能够自动切换分辨率、图片尺寸及相关脚本功能等 以适应不同设备。响应式网页设计就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。在众多的响应式框架中 来自Twitter开源的Bootstrap无疑是当前很流行的前端框架。而针对移动平台应用 jQueryMobile适用于所有流行的智能手机和平板电脑。基于jQuery的核心库也更容易让众多的开发人员学习和使用。本套前端开发教材优xuan的特点就是以流行网站元素为项目实战。
目录
- 前言
- 课程设计说明
- 关于引用作品版说明
- D11章Bootstrap入门
- 1Bootstrap简介
- 1.1Bootstrap简介
- 1.2Bootstrap文件结构和标准模板
- 操作案例:在页面中使用Bootstrap
- 2Bootstrap功能介绍
- 2.1.Bootstrap构成模块
- 2.2Bootstrap的特色和功能介绍
- 2.2.1Bootstrap的特色
- 2.2.2媒体查询
- 2.2.3Bootstrap主要功能
- 2.3Bootstrap优-秀插件
- 2.4Bootstrap版本变化
- 3Bootstrap优-秀网站示例
- 本章总结
- 本章作业
- D12章Bootstrap布局
- 1Bootstrap的结构
- 1.1使用栅格系统
- 1.1.1绘制栅格
- 1.1.2栅格系统的列偏移
- 操作案例1:制作音乐网站首页
- 1.1.3栅格系统的列交换
- 1.1.4栅格系统的嵌套
- 1.2响应式栅格
- 操作案例2:组合栅格系统
- 2CSS布局概要
- 2.1CSS布局简介
- 2.2基础排版
- 2.2.1标题
- 2.2.2主体内容
- 2.2.3对齐方式
- 2.2.4列表
- 3禁用响应式布局
- 本章总结
- 本章作业
- D13章Bootstrap组件
- 1按钮
- 操作案例1:制作Bootstrap官网案例页面
- 2表格
- 3CSS组件
- 3.1表单
- 3.2输入框组
- 3.3图标
- 3.4下拉菜单
- 操作案例2:制作收集用户信息页面
- 3.5按钮组
- 3.6导航和导航条
- 操作案例3:制作导航栏
- 3.7缩略图
- 3.8媒体对象
- 本章总结
- 本章作业
- D14章Bootstrap插件
- l动画过渡
- 2Bootstrap中的JS插件
- 2.1模态框
- 操作案例1:利用模态窗体制作百度登录框
- 2.2轮播图
- 操作案例2:利用.Bootstrap制作携程网首页的轮播图
- 2.3xuan项卡
- 2.4折叠
- 操作案例3:利用Bootstrap制作导航菜单
- 本章总结
- 本章作业
- D15章jQueryMobile入门
- ljQueryMobile入门
- 1.1jQueryMobile简介
- 1.2jQueryMobile准备文档
- 1.3jQueryMobile架构
- 1.3.1jQueryMobile属性
- 1.3.2jQueryMobile主题
- 1.3.3jQueryMobile视图
- 操作案例1:制作jQueryMobile基本页面
- 1.3.4jQueryMobile对话框
- 1.4与电话整合
- 操作案例2:制作商家信息展示页面
- 2jQueryMobileUI组件
- 2.1网格系统
- 2.2格式化内容
- 2.3可折叠的内容
- 2.4工具栏
- 操作案例3:制作影视介绍页面
- 2.5按钮
- 操作案例4:制作音乐播放器页面
- 本章总结
- 本章作业
- D16章jQueryMobile基础
- 1列表
- 1.1整页列表与插入列表
- 1.2视觉分隔符
- 1.3交互行
- 1.4图片
- 1.4.1图标
- 1.4.2缩略图
- 1.4.3计数气泡
- 2表单组件
- 2.1表单动作
- 2.2表单元素
- 2.2.1文本标签和容器标签
- 2.2.2文本输入框
- 2.2.3textarea输入区域
- 2.2.4HTML5新增标签
- 操作案例:制作信息收集页面
- 3jQueryMobileAPI
- 3.1jQuery:MobileAPI
- 3.2jQueryMobile事件
- 3.2.1页面事件
- 3.2.2方向事件
- 3.2.3触摸事件
- 本章总结
-
本章作业