HTML 中的 aside 标签

HTML <aside> 标签提供有关主要内容的信息。它表示构成文档主要文本流的内容。

它用于向用户提供额外信息，以了解文章或网页的重要点，但对于页面而言并非必需。它也可以用于编写网页的亮点。它主要用于表示侧边栏。它解释了与网页上存在的内容相关的一些内容。

<aside> 标签内的内容看起来与其他 HTML 标签内的内容相同，因此很难区分 <aside> 标签的内容与其他一些 HTML 标签的内容。我们可以使用层叠样式表来使 <aside> 标签内写入的内容具有不同的外观。

我们将看到 <aside> 标签在语义 HTML 中的位置，如下所示：

语义 HTML 指的是描述标签内内容含义的 HTML 标签。

Aside 的意思是“在旁边”，您可以看到 HTML 中的 <aside> 标签用于网页的侧边，因此它传达了与其名称相同的含义。根据您的网页设计，它可以在右侧或左侧，因此您可以将 <aside> 标签放置在右侧或左侧。

<aside> 标签的语法

在上述语法中，<aside> 是开始标签，</aside> 是结束标签。标题和段落标签用于 <aside> 标签内，以添加有关主要内容的重要信息。<h4> 是开始标签，</h4> 是用于表示标题的结束标签。<p> 是开始标签，</p> 是用于表示段落的结束标签。

HTML <aside> 标签的示例

我们将通过以下示例来理解 HTML <aside> 标签。

示例 1

在此示例中，我们将看到 <aside> 标签的用法。

代码

输出

这是 <aside> 标签的一个简单用法，用于向网页用户提供附加信息。

示例 2

在此示例中，我们将使用 CSS 使 <aside> 标签可识别。

代码

输出

在此示例中，使用 CSS 可以轻松识别 <aside> 标签。

示例 3

让我们再看一个示例来展示 <aside> 标签的用法，我们还将使用 CSS 为 <aside> 标签设置样式。

代码

输出

在网页的右侧可以清晰地看到 <aside> 标签，它借助 CSS 易于识别，并提供有关网页主要内容的附加信息。

HTML aside 标签还支持 HTML 中的全局属性和事件属性。

支持的浏览器

以下是支持 <aside> 标签的浏览器：

• 谷歌浏览器
• 火狐
• Internet Explorer
• Opera
• Safari