文字相關標籤
標題（h1 ~ h6）
<h1>主標題（最大）</h1> <!-- ← 一頁通常只有一個 h1 -->
<h2>副標題</h2> <!-- ← 章節標題 -->
<h3>小節標題</h3> <!-- ← 子章節 -->
<h4>更小的標題</h4>
<h5>很少用到</h5>
<h6>最小的標題</h6>
⚠️ 不要為了字大而用 h1！標題層級要有語意。
<!-- ❌ 壞：用 h1 只是因為想要大字 --> <h1>注意事項</h1> <!-- ✅ 好：用 CSS 控制大小 --> <p class="large-text">注意事項</p>
段落與文字
<!-- 段落 -->
<p>這是一個段落。段落之間會自動有間距。</p>
<p>這是第二個段落。</p>
<!-- 換行（不建立新段落） -->
<p>第一行<br>第二行</p>
<!-- 水平線 -->
<hr>
<!-- 粗體 / 斜體 / 底線 -->
<strong>重要文字</strong> <!-- ← 語意上「重要」，通常顯示為粗體 -->
<b>粗體文字</b> <!-- ← 只是視覺上粗體，沒有語意 -->
<em>強調文字</em> <!-- ← 語意上「強調」，通常顯示為斜體 -->
<i>斜體文字</i> <!-- ← 只是視覺上斜體 -->
<u>底線文字</u> <!-- ← 底線（少用，容易被誤認為連結） -->
<s>刪除線</s> <!-- ← 表示已不正確的資訊 -->
<del>被刪除的</del> <!-- ← 語意上表示「刪除」 -->
<ins>新插入的</ins> <!-- ← 語意上表示「新增」 -->
<!-- 上標 / 下標 -->
<p>水的化學式是 H<sub>2</sub>O</p>
<p>面積 = r<sup>2</sup> × π</p>
<!-- 預格式化文字（保留空格和換行） -->
<pre>
function hello() {
console.log("Hello");
}
</pre>
<!-- 程式碼 -->
<p>請使用 <code>console.log()</code> 來除錯。</p>
<!-- 引用 -->
<blockquote>
<p>學而不思則罔，思而不學則殆。</p>
<cite>— 孔子</cite>
</blockquote>
<!-- 行內引用 -->
<p>孔子說過 <q>學而時習之</q>。</p>
清單
<!-- 無序列表（項目符號） -->
<ul>
<li>蘋果</li>
<li>香蕉</li>
<li>橘子</li>
</ul>
<!-- 有序列表（編號） -->
<ol>
<li>第一步：開啟檔案</li>
<li>第二步：編輯內容</li>
<li>第三步：儲存</li>
</ol>
<!-- 自訂起始編號 -->
<ol start="5" type="A">
<li>E 項目</li>
<li>F 項目</li>
</ol>
<!-- 巢狀清單 -->
<ul>
<li>前端
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</li>
<li>後端
<ul>
<li>C#</li>
<li>Python</li>
</ul>
</li>
</ul>
<!-- 定義列表（術語 + 解釋） -->
<dl>
<dt>HTML</dt>
<dd>超文本標記語言，用來建立網頁結構。</dd>
<dt>CSS</dt>
<dd>階層式樣式表，用來美化網頁。</dd>
</dl>
特殊字元
<!-- 用實體名稱表示特殊字元 -->
< <!-- < -->
> <!-- > -->
& <!-- & -->
" <!-- " -->
' <!-- ' -->
<!-- 不換行空格 -->
© <!-- © -->
® <!-- ® -->
™ <!-- ™ -->
— <!-- — -->