查看“HTML”的源代码

HTML（超文本标记语言，HyperText Markup Language）是用于创建和设计网页的标准标记语言。它通过一系列标签（tags）定义网页的结构和内容，浏览器会解析这些标签并渲染成用户看到的页面。

== HTML 的核心特点 ==
=== 标记语言 ===
* 由标签（如 <html>、<p>、<img>）组成，用尖括号 < > 包裹。
* 标签通常是成对出现的（如 <p>内容</p>），也有自闭合标签（如 <img>）。
=== 描述结构 ===
定义网页的标题、段落、列表、图片、链接等元素。

例如：
* <h1>这是一个标题</h1>
* <p>这是一个段落。</p>
=== 超文本功能 ===
通过 <a> 标签实现页面跳转或资源链接：

<a href="https://example.com">点击这里</a>

== 基本HTML文档结构 ==
<pre>
<!DOCTYPE html>
<html>
<head>
    <title>网页标题</title>
    <meta charset="UTF-8">
</head>
<body>
    <h1>主标题</h1>
    <p>段落文字...</p>
</body>
</html>
</pre>
<!DOCTYPE html>：声明文档类型为HTML5。

<html>：根元素，包裹所有内容。

<head>：包含元信息（如标题、字符编码）。

<body>：网页可见内容。

== 常用HTML标签示例 ==
{| class="wikitable"
! 标签 !! 作用 !! 示例 !! 输出效果

| <code>&lt;h1&gt;到&lt;h6&gt;</code> || 标题（1级最大，6级最小） || <code>&lt;h1&gt;主标题&lt;/h1&gt;</code> || <h1 style="margin:0;font-size:120%">主标题</h1>

| <code>&lt;p&gt;</code> || 段落 || <code>&lt;p&gt;这是一个段落&lt;/p&gt;</code> || <p style="margin:0">这是一个段落</p>

| <code>&lt;a&gt;</code> || 超链接 || <code>&lt;a href="https://example.com"&gt;示例链接&lt;/a&gt;</code> || <a href="https://example.com">示例链接</a>

| <code>&lt;img&gt;</code> || 图片 || <code>&lt;img src="//upload.wikimedia.org/wikipedia/commons/thumb/b/b3/Wikipedia-logo-v2-en.svg/50px-Wikipedia-logo-v2-en.svg.png"&gt;</code> || <img src="//upload.wikimedia.org/wikipedia/commons/thumb/b/b3/Wikipedia-logo-v2-en.svg/50px-Wikipedia-logo-v2-en.svg.png">

| <code>&lt;ul&gt;</code> || 无序列表 || <code>&lt;ul&gt;<br>&lt;li&gt;项目1&lt;/li&gt;<br>&lt;li&gt;项目2&lt;/li&gt;<br>&lt;/ul&gt;</code> || <ul style="margin-top:0"><li>项目1</li><li>项目2</li></ul>

| <code>&lt;ol&gt;</code> || 有序列表 || <code>&lt;ol&gt;<br>&lt;li&gt;第一项&lt;/li&gt;<br>&lt;li&gt;第二项&lt;/li&gt;<br>&lt;/ol&gt;</code> || <ol style="margin-top:0"><li>第一项</li><li>第二项</li></ol>

| <code>&lt;div&gt;</code> || 块级容器 || <code>&lt;div style="background:#eee"&gt;容器内容&lt;/div&gt;</code> || <div style="background:#eee; padding:0 5px">容器内容</div>

| <code>&lt;span&gt;</code> || 行内容器 || <code>&lt;span style="color:red"&gt;红色文本&lt;/span&gt;</code> || <span style="color:red">红色文本</span>

| <code>&lt;strong&gt;</code> || 加粗文本 || <code>&lt;strong&gt;重要内容&lt;/strong&gt;</code> || <strong>重要内容</strong>

| <code>&lt;em&gt;</code> || 强调文本（斜体） || <code>&lt;em&gt;强调文本&lt;/em&gt;</code> || <em>强调文本</em>
|}
== 为什么学习HTML？ ==
* 是前端开发的基础（与CSS/JavaScript并称前端三件套）。
* 简单易学，适合编程入门。
* 几乎所有网站都依赖HTML构建。