查看“HTML”的源代码

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

== HTML 的核心特点 ==
=== 标记语言 ===
<pre>
由标签（如 <html>、<p>、<img>）组成，用尖括号 < > 包裹。
标签通常是成对出现的（如 <p>内容</p>），也有自闭合标签（如 <img>）。
</pre>

=== 描述结构 ===
定义网页的标题、段落、列表、图片、链接等元素。

例如：
* <h1>这是一个标题</h1>
* <p>这是一个段落。</p>
=== 超文本功能 ===
通过 <a> 标签实现页面跳转或资源链接：
<pre>
<a href="https://example.com">点击这里</a>
</pre>

== 基本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"
! HTML标签 !! 描述 !! 示例 !! 输出效果
|-
| <code>&lt;h1&gt;-&lt;h6&gt;</code> || 标题标签 || <code>&lt;h1&gt;一级标题&lt;/h1&gt;</code> || <h1 style="margin:0;font-size:1.2em">一级标题</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="#"&gt;链接&lt;/a&gt;</code> || <a href="#">链接</a>
|-
| <code>&lt;img&gt;</code> || 图片 || <code>&lt;img src="//placeholder.com/50" width="50"&gt;</code> || <img src="//placeholder.com/50" width="50">
|-
| <code>&lt;ul&gt;&lt;li&gt;</code> || 无序列表 || <code>&lt;ul&gt;&lt;li&gt;项目&lt;/li&gt;&lt;/ul&gt;</code> || <ul style="margin-top:0"><li>项目</li></ul>
|-
| <code>&lt;ol&gt;&lt;li&gt;</code> || 有序列表 || <code>&lt;ol&gt;&lt;li&gt;第一项&lt;/li&gt;&lt;/ol&gt;</code> || <ol style="margin-top:0"><li>第一项</li></ol>
|-
| <code>&lt;div&gt;</code> || 块级容器 || <code>&lt;div&gt;容器&lt;/div&gt;</code> || <div>容器</div>
|-
| <code>&lt;span&gt;</code> || 行内容器 || <code>&lt;span&gt;文本&lt;/span&gt;</code> || <span>文本</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>
|-
| <code>&lt;table&gt;&lt;tr&gt;&lt;td&gt;</code> || 表格 || <code>&lt;table border="1"&gt;&lt;tr&gt;&lt;td&gt;单元格&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;</code> || <table border="1"><tr><td>单元格</td></tr></table>
|-
| <code>&lt;br&gt;</code> || 换行 || <code>第一行&lt;br&gt;第二行</code> || 第一行<br>第二行
|-
| <code>&lt;hr&gt;</code> || 水平线 || <code>&lt;hr&gt;</code> || <hr>
|}

== 为什么学习HTML？ ==
* 是前端开发的基础（与CSS/JavaScript并称前端三件套）。
* 简单易学，适合编程入门。
* 几乎所有网站都依赖HTML构建。