24 个实用的 HTML5 前端开发教程

标签： html5 前端 开发 | 发表时间：2012-12-29 10:44 | 作者：
出处：http://news.cnblogs.com/

本文带来 24 个实用的 web 前端开发教程，涵盖 HTML5、CSS3、jQuery 等技术，希望能够帮你学习到一些新的技术，或为你的开发工作带来一些灵感。你可以通过图片下面的链接来查看演示和详细教程。

1.   使用 jQuery、HTML5 和 CSS3 创建音频播放器

演示 / 教程

2.   使用 jQuery、HTML5 和 CSS3 创建视频播放器

演示 / 教程

3.   制作可本地存储信息的 HTML5 表单

演示 / 教程

4.   使用 HTML5 和 CSS3 创建非常酷的表单

演示 / 教程

5.   使用伪元素和自定义属性创建 CSS3 菜单

演示 / 教程

6.   使用 CSS3 Transitions 创建虚化效果菜单

演示 / 教程

7.   HTML5 Gamepad（游戏手柄） API 入门

演示 / 教程

8.   使用 HTML5 和 CSS3 创建流式布局

演示 / 教程

9.   使用 CSS 3D Transforms 创建类似苹果的登录表单

演示 / 教程

10.   使用 jQuery 和 CSS3 创建图像滑块

演示 / 教程

11.   使用 CSS3 伪元素创建堆叠效果

演示 / 教程

12.   基于 HTML5 Canvas 和 jQuery 的图片幻灯效果

演示 / 教程

13.   纯 CSS 下拉菜单

演示 / 教程

14.   创建三角形效果

演示 / 教程

15.   CSS3 vs Photoshop：Transforms

演示 / 教程

16.   基于 CSS Transitions 的圆形悬浮效果

演示 / 教程

17.   创建手写信风格的联系人表单

演示 / 教程

18.   CSS 社交按钮

演示 / 教程

19.   创新型的 Web 字体样式

演示 / 教程

20.   HTML5 Slider 元素

演示 / 教程

21.   基于 CSS3 Transitions 和 Transforms 的表单

演示 / 教程

22.   使用 CSS3 实现 Orman Clark 的垂直导航菜单

演示 / 教程

23.   弹出式的个人信息框

演示 / 教程

24.   使用 jQuery、CSS3 和 HTML5 创建上传表单

演示 / 教程

Via Queness

本文链接



相关 [html5 前端 开发] 推荐：

HTML5游戏前端开发秘籍

- - 腾讯ISUX - 社交用户体验设计 - Better Experience Through Design
QQ空间Android版4.2和4.5上线的玩吧游戏“空间疯狂套牛”是一款使用HTML5开发出的手机游戏，虽然还有很多不足，但其中使用的一些技术与技巧还是很有必要为大家分享出来，方便大家用秘籍打通各种关卡创造出更多更好的HTML5游戏. (本秘籍主要讲述使用HTML + CSS技术方面). Android手机的屏幕碎片化非常严重，各种各样的分辨率非常之多，那么如何让游戏可以适配这些机型就显得尤为重要.

支付宝、腾讯前端开发工程师谈实战HTML5

- - 脚本爱好者
如今大热的 HTML5 到底美在哪里. HTML5到底能为实际的移动开发带来哪些改变. 来自支付宝和腾讯的前端开发工程师们有他们自己的看法. 　　上周，在一场名为“技术风云会”的定期讨论活动中，HTML5小组杭州联盟的同学、阿里巴巴集团 HTML5 爱好者，以及支付宝浙大校友会的会员集中讨论了 HTML5 对前端开发带来的直接改变.

24 个实用的 HTML5 前端开发教程

- - 博客园_新闻
本文带来 24 个实用的 web 前端开发教程，涵盖 HTML5、CSS3、jQuery 等技术，希望能够帮你学习到一些新的技术，或为你的开发工作带来一些灵感. 你可以通过图片下面的链接来查看演示和详细教程.   使用 jQuery、HTML5 和 CSS3 创建音频播放器.   使用 jQuery、HTML5 和 CSS3 创建视频播放器.

前端开发攻城师绝对不可忽视的五个HTML5新特性

- - CSDN博客推荐文章
日期：2013-7-2  来源： GBin1.com. HTML5已经火了一段时间了，相信作为web相关开发工程师，肯定或多或少的了解和尝试过一些 HTML5的特性和编程. 还记得以前我们介绍过的 HTML5新标签. 作为未来前端开发技术的潮流和风向标，HTML5绝对不容忽视. 在今天这篇技术分享文章中，我们将介绍几个 HTML5的重要特性，能够帮助你提高整个web应用的使用体验和开发效率，相信大家会感兴趣的.

Adobe、标准和HTML5 -HTML5 and CSS3 开发

- - HTML5研究小组
“[提供商之间的]最激烈的竞争将与 标准密切相关. 大部分聪明人的眼睛将紧盯着技术标准. 但在计算机行业，新标准既可能是无限财富的源泉，也可能导致企业帝国的毁灭. 尽管存在着如此多的风险，标准仍然点燃了无限激情”. —The Economist, 1993年2月23日. 在编写这段有关标准化的话时，计算领域的主要争议是Unix是否是一个可行的操作系统（以及是否为IBM、DEC和HP的更多专用操作系统带来了挑战），以及哪个视窗平台（SUN/AT&T还是IBM/DEC/HP）将成为标准.

HTML5历史与开发介绍-HTML5 入门教程

- - BlogJava_首页
HTML的发展历史和HTML5的诞生. HTML 5是近十年来Web开发标准最巨大的飞跃. 和以前的版本不同，HTML 5并非仅仅用来表示Web内容，它的新使命是将Web带入一个成熟的应用平台，在HTML 5平台上，视频，音频，图象，动画，以及同电脑的交互都被标准化. （HTML5也有了自己的logo）.

HTML5 Canvas开发框架：CasualJS Framework

- Jimmy - ITeye论坛最新讨论
CasualJS Framework是根据ActionScript3?.0的架构开发的一套适用于HTML5 Canvas的面向对象的开发框架. 虽然Canvas提供了强大的绘图功能，但满足不了高级开发的需要. 利用CasualJS的显示对象架构及渲染机制，你可以轻松的在Canvas中操控各种位图、图形、影片剪辑等显示对象.

HTML5游戏开发工具推荐：IMPACT

- iDesperadO - HTML5研究小组
Impact 是一个 JavaScript 游戏引擎，可以为桌面和手机浏览器开发令人惊叹的 HTML5 游戏. 我已经试过了四个其他 JavaScript 游戏引擎，这是我用过的第一个比较有意义的（……）Impact 是市场上第一个真正专业级的 JavaScript 和 HTML5 游戏引擎. ——《Game Developer Magazine》，2011年5月.

HTML5开发：原理与实现

- - Web App Trend
在这篇文章中， W3C 浏览器技术核心标准工作成员 Mike Smith 谈论了 HTML5 到底是什么，并给出了一些对开发人员有用的资源，可以让他们跟进不断演化的标准. 我们正处于Web平台更新换代的过程之中. HTML5通常被用来描述这一过程，尽管更新换代中的技术并不局限于HTML5标准所定义的特性.

HTML5开发工具大盘点

- - CSS库
相信到目前你应该已经对Canvas这一神奇的HTML5新元素有了一定的了解. 在本文中，我们将深入了解画布的功能及特点，学习如何在HTML中利用Canvas绘制图形以及其它类型对象. 正准备学习HTML5或者已经进行了一段时间的HTML5开发的童鞋，都有必要了解下，HTML5都有哪些开发工具，哪款开发工具更适合我?下面就一一盘点下：   一、HTML5开发工具之Adobe Dreamweaver.