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>

posted @ 2018-03-26 14:35  Sundy‘s园  阅读(171)  评论(0编辑  收藏  举报