HTML5中的Article和Section元素认识及使用_html5教程技巧

来源：动视网责编：小采时间：2020-11-27 15:18:01

HTML5中的Article和Section元素认识及使用_html5教程技巧

HTML5中的Article和Section元素认识及使用_html5教程技巧: HTML5带出了一系列新元素，并且将在未来被广泛应用。然而，有一些元素在使用时易被混淆，包括以下两个新元素：和。最常被问起的问题是：在什么情况下我们应该使用这些元素？以及我们应该如何正确的使用这些元素？ Section元素这是一个最容易产生歧义的元

推荐度：

点击下载本文 文档为doc格式

导读HTML5中的Article和Section元素认识及使用_html5教程技巧: HTML5带出了一系列新元素，并且将在未来被广泛应用。然而，有一些元素在使用时易被混淆，包括以下两个新元素：和。最常被问起的问题是：在什么情况下我们应该使用这些元素？以及我们应该如何正确的使用这些元素？ Section元素这是一个最容易产生歧义的元

HTML5带出了一系列新元素，并且将在未来被广泛应用。然而，有一些元素在使用时易被混淆，包括以下两个新元素：和

。
最常被问起的问题是：在什么情况下我们应该使用这些元素？以及我们应该如何正确的使用这些元素？

Section元素
这是一个最容易产生歧义的元素。它与元素有什么区别？我们一直在用来划分段落，所以除了,我们什么时候使用这个元素。我们引用官方文档来阐述它。根据WHATWG文档，对

元素做了以下描述：
“

元素表示了一篇文档或应用中，通用段落 - WHATWG”

从描述中我们可以看出

元素的作用就是分段，或多或少类似于。但是它仍有一个特例。在文档中，加入了一段特别声明：
“当一个元素仅用于风格样式或是为了脚本的方便，我们鼓励作者使用。

元素适用于，当元素的内容需要明确的列出时。- WHATWG”

基于这一点，我们可以总结以下两点：
第一，尽管section元素在技术上是可以设计样式的，但是当有复杂的样式或脚本时，我们仍建议使用div元素。
第二，类似于

元素，section元素是用来列举内容的。

因此在现实例子中，使用

元素的原因是结构化的列出博客的内容，代码如下：

代码如下:

Blog Post Title

Ice cream tart powder jelly-o.
Gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.

Blog Post Title

Ice cream tart powder jelly-o.
Gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.

Blog Post Title

Ice cream tart powder jelly-o.
Gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.

这只是个例子，

元素也可以用作其他用途。

Article元素
从名字上，它已经很好的诠释了自己，但是我们仍要看看官方文档上是如何描述它的：
“在文档，页面，应用或是站点上的一个独立部分，并且大体上，是可独立分配，或是重复使用的，例如在发布时。这个可以是论坛帖子，杂志或是新闻，博客条目，用户提交的评论，互动的小工具或小工具，或任何其他独立项目的内容。”

从上描述中，我们可以总结出元素专用于结构化文章，特别是我们要发布的，例如博客，页面内容或是论坛帖子。
以下例子给出了如何使用构建一个博客文章。

代码如下:

This is Blog Post Title

Author Name

Save in Categories

Sweet roll halvah biscuit toffee liquorice tart pudding sesame snaps.
Biscuit powder jelly-o fruitcake faworki chocolate bar. Pudding oat
cake tootsie roll sesame snaps lollipop gingerbread bonbon. Gummies
halvah gummies danish biscuit applicake gingerbread jelly-o pastry.

HTML5中的Article和Section元素认识及使用_html5教程技巧

推荐度：

点击下载本文 文档为doc格式

热门焦点

HTML5中的Article和Section元素认识及使用_html5教程技巧

HTML5中的Article和Section元素认识及使用_html5教程技巧

Blog Post Title

Blog Post Title

Blog Post Title

This is Blog Post Title

HTML5中的Article和Section元素认识及使用_html5教程技巧

最新推荐

猜你喜欢

热门推荐