|
|
|
|
|
全部课程 >web开发 |
|
HTML
5 + CSS3 原理与开发应用 |
7731 次浏览 56 次
|
|
|
孙明辉 |
具有超过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结合 |
|
|
|
|
|
|
|
|
|
7731 次浏览 56 次
|
其他人还看了课程 |
|
|
|
|
|
咨询目标
|
帮助客户设计、规划大数据架构
帮助客户建立大数据技术平台,
帮助客户建立大数据分析模型 |
咨询范围 |
大数据架构:数据结构模型,存储空间,数据分析模型
大数据技术平台:分布式存储与计算平台,采集工具,分析工具
大数据分析应用案例:分析模型,结果报告 |
咨询方式 |
调查分析客户当前的数据资源和使用情况。
为客户设计大数据架构
搭建大数据技术平台
建立大数据分析应用示例。 |
详情咨询:010-62670969, zhgx@uml.net.cn
|
|
|
|
|
|
|