html基本标签大全

作者：刺眼的男ren 发布日期:2026-03-26 浏览:76

<!DOCTYPE html>
<html>
<head>
    <title>HTML基本标签大全</title>
</head>
<body>
    <!-- 文档类型声明 -->
    <!DOCTYPE html> <!-- 声明文档类型为HTML5 -->

    <!-- 根元素 -->
    <html> <!-- HTML文档的根元素 -->

    <!-- 头部信息 -->
    <head> <!-- 包含元数据、标题等信息 -->
        <meta charset="UTF-8"> <!-- 设置字符编码 -->
        <title>页面标题</title> <!-- 页面标题，显示在浏览器标签上 -->
        <link rel="stylesheet" href="styles.css"> <!-- 链接外部CSS文件 -->
        <script src="script.js"></script> <!-- 链接外部JavaScript文件 -->
    </head>

    <!-- 主体内容 -->
    <body> <!-- 页面主体内容 -->
        <header> <!-- 页眉，通常包含网站标题或导航栏 -->
            <h1>欢迎来到我的网站</h1>
        </header>

        <nav> <!-- 导航栏 -->
            <ul>
                <li><a href="#home">首页</a></li>
                <li><a href="#about">关于我们</a></li>
                <li><a href="#services">服务</a></li>
                <li><a href="#contact">联系我们</a></li>
            </ul>
        </nav>

        <main> <!-- 主要内容区域 -->
            <section> <!-- 定义文档中的节 -->
                <h2>HTML简介</h2>
                <p>HTML是超文本标记语言，用于创建网页。</p>
            </section>

            <article> <!-- 定义独立的内容 -->
                <h2>文章标题</h2>
                <p>这是文章的内容。</p>
            </article>

            <aside> <!-- 侧边栏或辅助内容 -->
                <h3>相关链接</h3>
                <ul>
                    <li><a href="#">链接1</a></li>
                    <li><a href="#">链接2</a></li>
                </ul>
            </aside>
        </main>

        <footer> <!-- 页脚，通常包含版权信息或联系方式 -->
            <p>&copy; 2023 我的公司. 版权所有.</p>
        </footer>
    </body>
</html>

解释说明

<!DOCTYPE html>: 声明文档类型为HTML5。
<html>: HTML文档的根元素。
<head>: 包含元数据（如字符编码、页面标题、外部资源链接等）。
<meta charset="UTF-8">: 设置文档的字符编码为UTF-8。
<title>: 定义页面的标题，显示在浏览器标签上。
<link>: 链接外部样式表（CSS文件）。
<script>: 链接外部JavaScript文件。
<body>: 页面的主体内容。
<header>: 页眉部分，通常包含网站标题或导航栏。
<nav>: 导航栏，包含链接到不同页面或部分的链接。
<main>: 主要内容区域。
<section>: 定义文档中的节。
<article>: 定义独立的内容，如博客文章。
<aside>: 侧边栏或辅助内容。
<footer>: 页脚部分，通常包含版权信息或联系方式。

以上代码展示了HTML的基本结构和常用标签。

上一篇：html背景图片怎么设置大小

下一篇：html标签

大家都在看

静态html源码

404 html

ios打开html

nginx访问不到html

html 符号

colspan在html中是什么意思

怎么将网页另存为html

xml转html

html时间代码

html localstorage