本文探讨了HTML5在响应式设计中的应用，包括HTML5的可用特性、编写方式、精简语法、废弃标签以及新的语义化元素。重点讲述了如何利用HTML5创建响应式网页，如使用video和audio标签，以及实现离线访问。此外，还介绍了如何使用新的语义元素提升网页的可读性和结构化。
响应式设计的“移动优先”思想使它很适宜采纳最简洁、最有效和最具语义的代码。
本次内容：
- HTML5的哪些部分我们现在就能用？
- 如何编写HTML5网页
- HTML5的精简之道
- HTML5中的废弃零件
- HTML5中的全新语义化元素
- 嵌入媒体
- 可响应的HTML5 iFrame视频
- 让网站支持离线使用
HTML5的哪些部分我们现在就能用
虽然完整的HTML5规范尚待批准，但是现代浏览器都不同程度地支持HYML5的大多数新特性，当前HTML标准草案的内容最终未必全部会出现在W3C推荐标准中，但其中有很大一部分新特性现在已经可以用了。
如何编写HTML5网页
打开一个已有的网页。你可能会看到文件开头有这样几行代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />删除上面的代码片段并将其替换成如下代码片段：
<!DOCTYPE html> //文档如此简短，目的是以简洁的方式告诉浏览器用“标准模式渲染页面”。这种简洁高效渲染在html5
<html lang="zh">
<head>
<meta charset=utf-8> //meta是一个单闭合元素所以不需要关闭标签，字符通常都是utf-8HTML5的精简之道
如果你很注意代码风格，一般都会使用小写字母，将属性值用引号括起来，而且会为脚本或样式文件链接声明type属性。例如，你会使用如下的代码来引入一个样式表：
<link href="CSS/main.css" rel="stylesheet" type="text/css" />HTML5中不需要这么仔细，这样写它一样乐于接受：
<link href=CSS/main.css rel=stylesheet >你看了一定感到怪异，我懂我也明白。代码没有闭合标签的斜线（/）,属性值没有用引号括起来，没有type声明。但是，好说话原HTML5不在一这些。第二行示例代码和第一行一样有效。
这种宽松的语法可应用于整个文档，而不仅仅是链接CSS和Javascript文件的元素。例如定义一个如下所示的div:
<div id=wrapper>这是
最低0.47元/天 解锁文章
扫一扫
458
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
