HTML - <aside> 标签

HTML <aside> 用于提供有关 aside 元素周围内容的额外信息。<aside> 元素中可以包含的信息包括尾注、备注、术语列表、参考数据、一组链接、摘录等。

它通常用于通过添加更多详细信息或强调读者会感兴趣的段落来改进文章。如果从网页中删除 aside 内容，则主要内容不会受到影响，因为 aside 内容是页面中一个独立的、可选的组件。

语法

<aside>.....</aside>

属性

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

HTML aside 标签示例

下面的示例将说明 aside 标签的使用。在哪里、何时以及如何使用 aside 标签创建部分以提供额外信息。

创建 Aside 内容

在此示例中，我们将创建一个 aside 元素以呈现一些额外信息。

<!DOCTYPE html>
<html lang="en">

<head>
   <title>HTML aside Tag</title>
</head>

<body>
   <!-- Creating aside Element -->
   <p>
      It is typically used to improve an article by
      adding more details or emphasizing passages that
      the reader would find interesting. If you remove
      aside content from a web page, the main content 
      will not be impacted because aside content is a 
      separate, optional component of the page.
   </p>
   <aside>About HTML aside Tag</aside>
</body>

</html>

使用 aside 标签创建段落部分

以下是 HTML <aside> 标签的另一个示例。在这里，我们使用 <aside> 标签来标记 ‘article’ 元素中的一个段落。该段落仅与主要文章内容间接相关。

<!DOCTYPE html>
<html lang="en">

<head>
   <title>HTML aside Tag</title>
</head>

<body>
   <!-- Creating aside Element -->
   <p>Example of the HTML 'aside' Element</p>
   <article>
      <p>
         The HTML full form is Hyper Text Markup Language.
      </p>
      <aside>
         <p>
            The HyperText Markup Language or HTML is the 
            standard markup language for documents designed 
            to be displayed in a web browser.
         </p>
      </aside>
   </article>
</body>

</html>

设置 Aside 元素的样式

在以下程序中，我们使用 HTML <aside> 标签来表示 HTML 文档的一部分。我们使用 CSS 来设置创建的 ‘aside’ 元素的样式。

<!DOCTYPE html>
<html lang="en">

<head>
    <title>HTML aside Tag</title>
    <style>
        aside {
            width: 30%;
            padding-left: 15px;
            margin-left: 15px;
            float: right;
            background-color: lightgray;
            border-radius: 10px;
        }
        p {
            width: 60%;
            float: left;
        }
    </style>
</head>

<body>
    <!-- Creating aside Element -->
    <h2>HTML 'aside' Element</h2>
    <p>
        It is typically used to improve an article by adding more details 
        or emphasizing passages that the reader would find interesting. 
        If you remove aside content from a web page, the main content will
        not be impacted because aside content is a separate, optional 
        component of the page.
    </p>
    <aside>
        <ul>
            <li>HTML</li>
            <li>CSS</li>
            <li>JavaScript</li>
            <li>Angular</li>
            <li>React</li>
        </ul>
    </aside>
</body>

</html>

支持的浏览器

标签
aside	是 6.0	是 9.0	是 4.0	是 5.0	是 11.1

html_tags_reference.htm

打印页面