HTML5的新功能？您需要知道的9个要素

HTML5是网络上使用最广泛的标记语言的最新，最好的版本。该语言的最新版本进行了一些重大更改，如果您不使用它们，则会错过一些非常酷的功能。

我们没有足够的空间来覆盖所有语言HTML第五版中的新元素，但是这九个是最重要的元素。有关HTML5中新元素和API的更多信息，请务必查看W3Schools。

语义元素简介

就像互联网上的许多内容一样，HTML5已经转向关注语义。现在，标签不仅用于格式化，还用于告诉浏览器和搜索引擎其周围环境的含义。

例如，

只是告诉浏览器它包含一个段。我们将暂时讨论的

告诉浏览器它包含页面的主要内容。

语义网仍在发展中，我们只是从头开始它可以做到。 HTML5正在帮助将语义标记引入互联网的更大范围，这只会对语义处理的未来有所帮助。

1。

标记定义“独立的，独立的内容"。最简单的示例当然是文章。对于这篇特别的文章，我们将在介绍之前打开标签，并在结论之后关闭标签。

<article> All of the text in your self-contained section.</article>

但是您也可以使用其他方法。例如，许多烹饪博客都包含有关食谱如何产生或对作者重要的个人故事。然后是食谱本身。您可以提出以下论点：每个要素都可以独立存在。

在论坛中，每个帖子或主题都可以视为独立的，并且可以用自己的

标签进行标记。在大多数情况下，它将用于页面的主要内容。但是请记住，您也可以更创造性地使用它。

2。

与

密切相关的是
。这定义了“内容的主题分组，通常带有标题。"因此
将位于
内……对吗？

不一定。 W3指出，这取决于您网站的结构。您可能在页面的不同部分具有独立的内容（例如，考虑新闻站点的首页）。然后，您可能会在该文章中包含章节。

<article> <section> <h2>Why You Need a DAC</h2> <p>Everything sounds better.</p> </section> <section> <h2>How to Set up a DAC</h2> <p>Here's what you need to do . . .</p> </section>

如果适合您的页面，甚至可以在章节中包含章节。请记住，部分只是“内容的主题分组"，您会发现很多使用它的地方。

3。

此元素“应用作介绍性内容的容器。"简而言之，它是页面的一部分，可以帮助人们了解他们将要阅读的内容。

但不要上当了-您可以多次使用此容器。例如，您可以使用它来标识博客文章的页面标题和介绍性段落。但是，您也可以使用它来标记每个部分的介绍性内容。

<article> <header> <h1>Everything You Need to Know about DACs</h1> <p>Here's a useful introduction to DACs...</p> </header> The rest of your article goes here.

标题部分通常至少包含一个标题标签-H1，H2，依此类推。它们不是必须的，但是总的来说，如果您使用的是标题标签，那么可以肯定的是，您应该包含标题内容。

4。

W3说，页脚标签通常包含“文档的作者，版权信息，使用条款的链接，联系信息等。"您可以将其视为“整理"内容。

<footer> Copyright: PCPC.me, 2017. <a href="//www.PCPC.me/contact/">Contact Us</a></footer>

文档还指出，页面上可以有多个页脚节。不过，最好将所有这些信息都放在一个位置。

5。

此标记包含给定页面的导航链接。请注意，只有导航部分会获得此标签，而不是页面上的所有链接。它用于导航栏和类似工具。

<nav> <a href="//www.PCPC.me/>Home</a> <a href="//www.PCPC.me/about">About</a></nav>

这是一个非常简单的标签-内容已足够。用它来定义导航部分，不要在页面上再次使用它。

6。

HTML5中最有趣的新元素之一就是aside。 W3给出了“无用的内容"定义。

简而言之，无用的东西与周围的信息有关（但与之分开）。它可能是一个侧边栏，可为您的内容添加细节。当在一组

标签中使用它时，它会提供理解主要内容所不必要的其他信息。

例如，如果我们在本文中包括了一个侧边栏，以提供有关

，但是

标签: HTML5 Web设计 Web开发