1.新的文档类型(Doctype)
<!DOCTYPE html>,只要简单的15个字符就可以了,再也不用像以前那样写一长串文档类型的代码了。
2.重新定义<small>
<small>元素被重新定义了,或者更恰当地说,它现在用来代表小字或其他边注(如,网站底部的版权声明)。
3.不再需要脚本,链接类型,即去掉了type属性
<link rel="stylesheet" href="path/to/stylesheet.css" />
<script src="path/to/script.js"></script>
4.使用还是不使用引号
HTML5与XHTML不同,如果你不喜欢的话你不必用引号将属性包裹起来。不过,要是你觉得用引号会让你觉得更加舒服的话,当然也不会有任何问题。
5.使你的内容可编辑
HTML5其中一个非常强大的功能就是“contenteditable”,顾名思义它将允许用户编辑元素(包括他的子元素)内包含的任何文本内容。它的用途非常广,如,简单的任务清单或是基于wiki的站点也非常实用,此外,它还有一个优势就是利用了本地的存储。
<ul contenteditable="true"></ul>,则ul列表中的所有项都是可编辑的。
6.form表单的验证功能
虽然说内置的表单验证很快就会到来,但是我们也不能完全依靠这个。而且chrome浏览器对form验证的支持也不是很好。尽管他们有技术实现,但还是不提供支持,从这个层面上也给出了暗示,不要太依赖内置的表单验证。
7.占位符
<input name="email" type="email" placeholder="doug@givethesepeopleair.com" />,虽然样式没有js特效实现的好看,但是未来的发展一定能弥补这点点小缺陷。
8.本地存储
多亏了HTML5的 local storage ,我们可以让高级浏览器“记住”我们输入的内容,就算后来浏览器关闭或者重新刷新也不受影响。尽管不是所有的浏览器都支持,但是最关键的 Internet Explorer 8, Safari 4, Firefox 3.5.都支持。
9.IE和HTML5
IE不知道header, footer, article, section, nav, menu, hgroup......这些元素究竟是什么,因而会无视这些格式,还需要用到下面的代码来解决这个问题:
document.createElement("article");
document.createElement("footer");
document.createElement("header");
document.createElement("hgroup");
document.createElement("nav");
document.createElement("menu");
不过,这些事情可以用一个简单的js引入就可以解决,http://html5shiv.googlecode.com/svn/trunk/html5.js,把这个js放在head中,
<!--[if IE]>
<script src="
http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
这样就可以只让IE识别,发送请求了。
10.必要(required)属性
<input type="text" name="someInput" required="required">,如果输入框是空的,表单提交将无法提交,突出显示文本框,前提是,浏览器支持的话。
11.自动对焦(Autofocus)属性
<input type="text" name="someInput"
autofocus="autofocus">,如果某个输入应该被”选择“或被聚焦,我们现在可以使用HTML的自动对焦autofocus属性。
12.视频,音频
现在各浏览器对其支持并不是很好或统一,期待其发展
13.何时使用<div>
是否还需要使用<div>标签呢?当然需要。例如,如果你想在一个元素里将一段代码包裹住,特别是为了内容的定位,<div> 将会是非常理想的选择。不过,如果不是上述情况而是要包裹博客文章、或者页脚的链接列表,建议你分别使用 <article>和<nav>元素。
分享到:
相关推荐
HTML5入门学习技巧;提供入门级的HTML5学习的技巧
html详细学习资料和技巧,大家下来看看吧
22个HTML5 技巧二:上面一章讲到了HTML5的几个技巧,现在我们来学习新的技巧 8. 占位符 此前,我们需要使用JavaScript来创建文本框的占位符。你可以初步设定值属性来看是否合适,但是只要用户删除了该文本,输入的...
因此,为了应对即将到来的HTML 5,本文总结了11个HTML 5的初级技巧,希望能对你进一步学习好HTML 5会有所帮助。 1. 新的Doctype声明 XHTML的声明太长了,我相信很少会有前端开发人员能手写出这个Doctype声明。 <!...
html5的一些新增属性和功能是让代码变得更简洁,这总归是一件好事,应该值得我们推崇。最后感谢你阅读了这篇html5的入门级文章,希望能为你进一步学习html5提供一些帮助。
解读HTML5:建议、技巧和技术 淘宝的HTML5实践 运用EntityComponent架构的游戏引擎快速开发HTML5游戏 3D引擎CopperLicht 3D引擎CopperLicht(二) c3dl资源分享 openGL讲义 OpenGL入门教程 WebGL 和...
HTML 5基本结构 HTML 5基本结构由 <!DOCTYPE html>、<html>、、<title> 和 <body> 组成。
请关注html5cn的新浪微博@html5cn、腾讯微博@html5cn,在微博中欢迎大家与html5cn互粉,我们将在这里集中讨论关于html5的发展和使用技巧,希望大家能共同学习,共同进步。 1. 如何修改jQuery默认编码(例如默认UTF-8...
这是我最近学习html,java web开发的一些小技巧,对于初学者也许有用
指导你熟练运用电脑技巧,帮助你真正掌握电脑技能学习电脑应用的技巧与方法是至关重要的一步。主要内容:表格动态与互特效;CSS滤镜高级应用;弹出窗口完全控制;定制个性图形表单;网页配色技巧与实用方案;网页...
想学习HTML5的看过来,里边讲解了一些最为基础的HTML5相关知识,想学习的同学一定不能错过啊!
HTML4文档技巧积累,各种HTML问题技巧。网页架构:主要网页主架构的介绍 分隔标签:也就是所谓的水平线 排版标签:针对标签的属性,可做适当的版面编排 字体标签:教导您设定文字的字体。 文字标签:教导您设定...
HTML5 全套知识点打包 很值得下载学习 包含:揭秘HTML5和CSS3.rar 22个HTML5 技巧一.doc 22个HTML5 技巧二.doc 22个HTML5 技巧三.doc 全方位了解HTML5 .doc HTML5设计原理+.doc HTML5高级程序设计(1).pdf 等等
HTML5游戏开发实战涉及多个关键方面,包括游戏设计、用户体验、性能优化以及利用HTML5的特性来实现各种游戏功能。...通过不断学习和实践,你可以逐渐掌握HTML5游戏开发的技巧和精髓,创造出受欢迎的游戏作品。
资源名称:HTML5基础知识 核心技术与前沿案例内容简介:HTML5基础知识 核心技术与前沿案例《HTML5基础知识、核心技术与前沿案例 》是一本引导初、中级学习者深入了解并有效掌握HTML5核心技巧的技术实战书籍,全书...
《高性能html5》中总结了许多实践经验、关键技巧,并提供了丰富的示例,作者有意无意地将软件工程以及前端开发技术之道隐藏于朴实的描述中。 通过学习《高性能html5》,读者能够掌握如何创建自己的高性能网站。《高...
web 笔记,记录自己学习前端的历程,记录自己学习的代码,包含JavaScript、CSS、HTML 等;各种前端开发的小技巧及总结. web 笔记,记录自己学习前端的历程,记录自己学习的代码,包含JavaScript、CSS、HTML 等;各种...
很多不错的html+css的技巧,可以拿去学习下。
Html网页代码常用小技巧总结续,网页制作学习.docx