|
|
|
|
|
|
|
|
全部课程 >web开发 |
|
HTML
5 + CSS3 原理与开发应用 |
7140 次浏览  37 次
|
 |
|
| 孙明辉 |
| 具有超过12年一线开发经验，多本Web开发畅销书作者，涉及：javascript,HTML5,CSS3,JQuery. |
| |
|
|
| 时间地点： 北京 上海 深圳根据报名开班 |
| 课程费用： 5000元/人 |
|
| |
|
|
| 企业内训：可以根据企业需求,定制内训,详见
内训学习手册 |
|
 |
认证方式：
培训前了解能力模型。
培训后进行能力评测：
在线考试
能力分析，给出学习建议
合格者颁发证书，作为职业技能资格证明
|
 |
|
|
|
本课程介绍使用HTML5新的技术特性，结合CSS创建具有良好用户体验的Web应用程序，课程将通过大量的实例讲解如何有效而适当的应用HTML和CSS进行实践。
|
| 培训目标： |
- 了解HTML5的规范整体
- 了解标签语言
- 了解如何使用表单
- HTML5音频和视频播放
- HTML5 APIs概述
- 采用HTML5 Canvas而不是SVG动态产生渲染图形
- 使用HTML5 通讯APIs
- HTML5 Web Sockets
- HTML5 Web Workers
- HTML5 Geolocation
- HTML5存储
- CSS3.0控制原理与应用
- JQuery Mobile
|
| 培训对象：
软件开发人员 |
| 学员基础：
有软件开发经验 |
| 授课方式：定制课程
+ 案例讲解 + 小组讨论，60%案例讲解，40%实践演练 |
| 培训内容：2天
|
| HTML5
概述 |
HTML的发展史
HTML5的版本
WHATWG and W3C 规范
HTML5的新特性
HTML5能做什么
HTML5能做什么对HTML5和CSS3的支持
检测浏览器对HTML 5的支持 |
HTML5
标签语言
|
HTML5页面结构
HTML5 DOCTYPE
根元素
字符编码
HTML5新增的语义元素
（1）<header>
（2）<nav>
（3）<article>
（4）<footer>
（5）<section>
（6）<aside>
其他新增的元素
（1）<time>
（2）<mark>
（3）<figure>和<figcaption>
（4）<progress>
（5）<meter>
（6）<details>和<summay>
验证HTML5页面及显示页面大纲
验证HTML5页面及显示页面大纲 |
| HTML5表单 |
HTML
4的困惑
HTML 5新增的输入组件
（1）email 邮件输入组件
（2）url 网址输入组件
（3）number 数字输入组件
（4）range 范围输入组件
（5）Date pickers (date, month, week, time,
datetime, datetime-local) 日期系列输入组件
（6）search 搜索输入组件
（7）color 颜色输入组件
（8）tel 电话输入组件
HTML 5新增的输入属性
（1） autocomplete
（2） autofocus
（3） form
（4） form overrides (formaction, formenctype,
formmethod, formnovalidate, formtarget)
（5） height 和 width
（6） list
（7） min, max 和 step
（8） multiple
（9） pattern
（10） placeholder
（11） required
测试浏览器对HTML5表单元素的支持
HTML5的表单验证
（1） 定制验证错误消息
（2） 定制验证显示方式
（3） 取消验证 |
| HTML5
音频和视频播放 |
video元素及其属性
视频编解码器
视频转换工具
各种浏览器支持些什么格式
旧浏览器的过渡解决方案
视频与脚本--简单的视频播放器
音频
|
| 采用HTML5
Canvas绘制图形 |
<canvas>元素
检查浏览器的支持情况
基本图形绘制
（1）画线
（2）矩形
（3）曲线
路径
变换
（1）平移
（2）缩放
（3）旋转
渐变
（1）线性渐变
（2）径向渐变
绘制文本
绘制图像 |
使用HTML5
通讯APIs
|
跨文档消息通信
源安全
检测浏览器对postMessage的支持
XMLHttpRequest Level2
XMLHttpRequest Level2新增事件
检测浏览器对XMLHttpRequest2的支持
跨域访问注意事项 |
HTML5
Web Sockets
|
HTTP特点
如何实现实时（real-time）通讯
WebSocket特性
WebSocket与轮询方式的比较
Web Socket建立方法
WebSocket 的事件
WebSocket的属性
渐进增强和降级处理 |
| HTML5
Web Workers |
Web
Workers介绍
Multi-core processor architecture
Web Worker communication
使用 Web Workers APIs
案例应用实践，练习指导
|
| 地理定位 |
地理定位介绍
在浏览器中使用地理定位
定位的技术背景
openstreetmap上显示当前位置
使用googlemaps追踪位置
案例应用实践，练习指导 |
| HTML5存储 |
为什么需要本地存储
本地存储的限制
Web存储的两种类型
判断浏览器是否支持WebStorage
存取信息
storage事件
Web SQL
IndexedDB |
| CSS3讲解 |
CSS3概述
半透明效果
CSS3属性选择器
边框样式
（1）border-radius：圆角边框
（2）border-image：图片边框
（3）box-shadow：为边框添加阴影
文本样式
（1）Text-shadow：文本阴影样式
（2）Text-overflow：文本溢出样式
背景色渐变
（1）Linear-gradient：线性渐变函数
（2）Radial-gradient：径向渐变函数
（3）在线生成渐变效果
元素变形
（1）transform : rotate（旋转变形）
（2）transform：scale（缩放变形）
（3）transform：translate（位移变形）
（4）transform：skew（倾斜变形）
效果过渡
（1）transition-property ： 参与过渡效果的样式
（2）transition-duration： 过渡效果的持续时间
（3）transition-delay： 产生过渡效果前的等待时间
（4）transition-timing-function： 过渡效果控制 |
| jQuery
Mobile |
jQuery
Mobile设计的技术思考和商业思考
jQuery Mobile入门初体验；
使用页眉、工具栏和标签栏；
jQuery Mobile中的表单和按钮；
jQuery Mobile中的列表；
jQuery Mobile和CSS结合；
jQuery Mobile主题；
jQuery Mobile的API;
和服务器集成；
jQuery Mobile和HTML5开发框架PhoneGap结合 |
|
| |
|
| |
|
|
|
|
|
|
7140 次浏览 37 次
|
| 其他人还看了课程 |
|
|
|
|
|
| 咨询目标
|
帮助客户设计、规划大数据架构
帮助客户建立大数据技术平台，
帮助客户建立大数据分析模型 |
| 咨询范围 |
大数据架构：数据结构模型，存储空间，数据分析模型
大数据技术平台：分布式存储与计算平台，采集工具，分析工具
大数据分析应用案例：分析模型，结果报告 |
| 咨询方式 |
调查分析客户当前的数据资源和使用情况。
为客户设计大数据架构
搭建大数据技术平台
建立大数据分析应用示例。 |
| 详情咨询：010-62670969， zhgx@uml.net.cn
|
|
|
|
| |
| |
| |
