HTML5 新元素标签系列：最简版 HTML5

我们不讨论为什么我们现在就可以用 HTML5 而不是等到2022，这篇文章将给你提供一系列 HTML样板，你现在就可以把他们应用在你的项目中。

五秒内开始用 HTML5

是你页面的标志符合 HTML5 一个超级简单的方法就是将 DOCTYPE ——不管它现在是什么——改为<!DOCTYPE html>。就是这么简单，不需要再做其他的事。

Google 已经这么做了，看一下他们的主页，都只用了一行：<!doctype html><head><title>HTML 5 - Google Search</title><script>...

但想不到的是，Google的搜索结构页面并不符合标准，因为他们用了一些无效的标签如<font>还有一些其他的错误，但还算好。通过使用正确的DOCTYPE，他们仍然利用上了HTML解析规则（比如说在<script>没有类型属性）。

HTML5 最简版

如果你希望快速做出原型或者做个实验，而不需要太多样式的话，你或许对以下的微缩版 HTML 5 文件感兴趣：

<!DOCTYPE html>
<title>Small HTML 5</title>
<p>Hello world</p>

这也是完全符合 HTML5 规范的。

（有趣的是，当拿掉<title>标签后，对于这一文件是否还符合规范却有不同的观点）。

考虑HTML 5 完整性和兼容性

最后更完整的样板需要指出字符集。没有这个的话，有些字符可能不会正常显示（以前我花费了大量时间试图搞清楚原因）

我们同样还包含了 HTML5 shiv ，这样的话我们就能在 IE 中给元素添加样式。注意，你必须在 <head> 元素里包含这段脚本（代码中绿色部分）。

最后，我们添加了一些 CSS 样式，是块元素能显示为块，因为这并不是许多浏览器的默认行为。

那么，下面就是这个了——一个有效完整的 HTML5文件样板：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML 5 complete</title>
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>
article, aside, details, figcaption, figure, footer, header,
hgroup, menu, nav, section { display: block; }
</style>
</head>
<body>
<p>Hello World</p>
</body>
</html>

如果你想使用 HTML5做一些实验，默认的 JS Bin模板是一个 HTML5 样板，你可以拿来使用。

转载于:https://www.cnblogs.com/h5rocks/archive/2012/11/28/2793516.html

HTML5 新元素标签系列：最简版 HTML5相关推荐

html5 meter,html5 meter标签是什么意思？html5 meter标签的用法及属性介绍
html5 meter标签是什么意思?html5 meter标签的用法及属性介绍都在这里,本篇文章主要介绍了html5 meter标签的定义和具体的使用方法,还有html5 meter标签的属性介绍 ...
浅析HTML5中标签del和ins以及HTML5中被舍弃的标签
浅析HTML5中标签del和ins 在HTML中,一般购物网站的开发中会多次重复用到删除标签和下划线标签,若要实现删除线效果,可爱的程序员们起初都会选择用标签,实现文字下划线呢,也会自然而然的想到用标 ...
html5 section标签,html5 section标签是什么意思？html5 section标签的用法总结
本篇文章主要的介绍了关于HTML5 section标签的定义以及它的用法,最后还有一个案例总结,现在让我们开始阅读这篇文章吧先来解释下html5 section标签的意思: html5 sectio ...
html5 i标签什么意思,快速了解HTML5 b和i标签
b 和 i 标签在现在的 Web 标准潜规则中是不推荐使用,甚至是反对使用的,因为认为他们只是"表现"粗体和斜体,而没有任何"语义".更多的用 strong 和 ...
html5中新增标签的兼容性如何设置,HTML5新标签的兼容性处理
普通浏览器普通不支持HTML5新标签的浏览器 -- 能正常解析,但会当初成 inline 元素对待在不支持HTML5新标签的浏览器里,会将这些新的标签解析成行内元素(inline)对待,所以我们只 ...
php中 datalist,html5 datalist标签的用法是什么？这里有datalist标签的用法实例
本篇文章主要为大家讲述了关于html5 datalist标签的用法及html5 datalist标签的用法实例.本文说了两个常用的选项框的实例供大家选择观看,下面就让我们一起来看这篇文章吧我们先来看 ...
c 嵌入html5 win7,Html5新标签解释及用法
2011-01-28 HTML 5 是一个新的网络标准,目标在于取代现有的 HTML 4.01, XHTML 1.0 and DOM Level 2 HTML 标准.它希望能够减少浏览器对于需要插件的 ...
html5变动标签新写法,Html5新标签解释及用法
Html5新标签解释及用法发布时间:2012-02-17 22:50:45 作者:佚名我要评论 HTML 5 是一个新的网络标准,目标在于取代现有的 HTML 4.01, XHTML 1. ...
html5多大场景,HTML5新标签解释及其使用场景
我们来看一下HTML 5提供的一些新的标签用法和HTML 4的区别标签定义外部的内容.比如来自一个外部的新闻提供者的一篇新的文章,或者来自 blog 的文本,或者是来自论坛的文本,亦或是来自其他外部 ...

HTML5 新元素标签系列：最简版 HTML5

HTML5 新元素标签系列：最简版 HTML5相关推荐

最新文章

热门文章