HTML5介绍—1 HTML5简介
1.1 什么是HTML5?
①HTML5 是最新的 HTML 标准。
②HTML5 是专门为承载丰富的 web 内容而设计的,并且无需额外插件。
③HTML5 拥有新的语义、图形以及多媒体元素。
④HTML5 提供的新元素和新的 API 简化了 web 应用程序的搭建。
⑤HTML5 是跨平台的,被设计为在不同类型的硬件(PC、平板、手机、电视机等等)之上运行。
注释:在下面的章节中,您将学到如何“帮助”老版本的浏览器处理 HTML5。
1.2 HTML5文档类型声明
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title of the document</title>
</head>
1.3 HTML5浏览器支持
①所有现代浏览器都支持 HTML5。
②此外,所有浏览器,不论新旧,都会自动把未识别元素当做行内元素来处理。正因如此,您可以帮助老式浏览器处理”未知的“ HTML 元素。
注释:您甚至可以教授石器时代的 IE6 如何处理未知的 HTML 元素。
1.4 HTML5新定义块级元素
HTML5 定义了八个新的语义 HTML 元素。所有都是块级元素。
您可以把 CSS display 属性设置为 block,以确保老式浏览器中正确的行为。
实例:
header, section, footer, aside, nav, main, article, figure{
display: block;
}
1.5 向 HTML 添加新元素
您可以通过浏览器 trick 向 HTML 添加任何新元素:
本例向 HTML 添加了一个名为 <myHero> 的新元素,并为其定义 display 样式:
实例:
<!DOCTYPE html>
<html>
<head>
<title>Creating an HTML Element</title>
<script>document.createElement("myHero")</script>
<style>
myHero {
display: block;
background-color: #ddd;
padding: 50px;
font-size: 30px;
}
</style>
</head>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
<myHero>My First Hero</myHero>
</body>
</html>