HTML简单容器元素

最新推荐文章于 2024-08-14 12:45:22 发布

pythonset

最新推荐文章于 2024-08-14 12:45:22 发布

阅读量81

点赞数

分类专栏： html 文章标签：前端 html

本文链接：https://blog.csdn.net/pythonset/article/details/127495430

版权

html 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

这个示例展示了HTML的基本结构，包括无语义的div元素和语义化的容器元素如header、footer、article、section和aside。内容包含一个图片和一个未填充的列表，以及空的section和article，旁边有一个aside元素用作侧边栏。

摘要由CSDN通过智能技术生成

容器元素

容器元素：该元素代表一块区域，用于放置其他元素

div元素

没有语义

语义化容器元素

header：通常表示页头，或者文章的头部

footer：通常代表页脚，或者用于文章的尾部

article ：通常用于表述整篇文章

section: 通常表示文章的一段

aside:通常表示附加的信息，侧边栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div>
        <div><img src="" alt=""></div>
        <div>
            <ul>
                <li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste, alias.</li>
                <li>Labore maxime possimus vero quae delectus aspernatur natus quas consectetur!</li>
                <li>Inventore illo debitis possimus necessitatibus quas fugiat quod? Similique, voluptatibus!</li>
                <li>Soluta animi ratione praesentium nihil magnam ex quia velit placeat!</li>
                <li>Ipsum repudiandae, fugit quia culpa consectetur dolorem aut adipisci velit!</li>
                <li>Numquam veniam doloremque soluta totam odio explicabo praesentium cum molestias!</li>
            </ul>
        </div>
    </div>
    <header></header>
    <section>
        <p></p>
    </section>
    <section>
        <p></p>
    </section>
    <article></article>
    <aside>adsa</aside>
    <footer></footer>
</body>
</html>