您的位置:首页 > 运维架构 > 网站架构

在网站制作中随时可用的10个 HTML5 代码片段

2014-04-14 09:34 351 查看
HTML 很容易写,但创建网页时,您经常需要重复做同样的任务,如创建表单。在这篇文章中,我收集了10个超有用的

HTML 代码片段,有 HTML5 启动模板、空白图片、打电话和发短信、自动完成等等,帮助你提高开发速度。
您可能感兴趣的相关文章

赞!九个不可思议的 WebGL 应用试验
2012年最经典的10款 HTML5 游戏集锦
35款非常优秀的基于 HTML5 网页游戏
20个惊艳的 HTML5 Canvas 应用试验
8个惊艳的 HTML5 和 JavaScript 特效

HTML5 启动模板

当启动一个新的项目的时候,你需要一个启动模板。这里是一个简洁干净的模板,可以作为
HTML5 项目的基础。

  

获取方位的表单 (Google Maps)

这里是一个简单但功能强大的表单代码,用户可以输入他的位置指示到特定的地方。对于联系页面非常有用。

  

Base64 编码的空白 GIF 图片

我不推荐使用透明的 GIF,但我知道,即使在2013年,很多人都还在使用他们。如果你是其中之一,你可能会享受这个 Base64 编码的 1 * 1px的空白 GIF。这种方式比使用的图像更好。

  

Email 校验的正则表达式

HTML5 对表单功能进行了很大的正确,例如允许使用正则表达式模式来验证电子邮件。

  

嵌入 Flash

你是否经常需要再
HTML 页面中嵌入 Flash 文件?如果是的话,你会更好地保存下面的 Flash 嵌入代码以供将来使用。

  

HTML5 video with Flash fallback

新的
HTML5 规范的另一大特点是 Video 标签,让您轻松嵌入视频文件。但不幸的是,一些浏览器不能处理嵌入式 HTML5 视频。因此,这里兼容旧的浏览器的代码,在不支持 HMTL5 视频的浏览器使用 Flash。

  

打电话和发短信

在移动网页中,有一种快速的方法来建立呼叫和短信链接。下面是一个示例代码,记得收藏在您的代码片段库里。

  

自动完成功能

使用 dataList 元素,HTML5 允许你创建一个输入字段自动完成数据的列表。超级有用的!这里是一个示例代码。

  

可下载的文件

HTML5 允许使用 download 属性强制下载文件。这里是一个标准链接到一个可下载的文件。

 

Crash IE6

在 2013 年,带给前端开发人员恶梦的 Internet Explorer 6 市场份额已经降了很多了。但一些人仍然在使用它。如果你想摆脱这种旧的浏览器,这里是一个非常有趣的代码,包括在你的

HTML 页面,让 IE6 崩溃。

您可能感兴趣的相关文章

让人惊叹的 Chrome 浏览器实验项目
不可思议的 HTML5 Canvas 应用试验
分享21款丰富多彩的 HTML5 网页游戏
推荐10款优秀的 HTML5 在线设计工具
2012年最佳的 HTML5 应用和网站作品

英文链接:Hyper useful, ready to use HTML5 snippets

文章来源:梦想天空 ◆ 关注Web前端开发技术 ◆ 分享网页设计资源
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: