HTML中階
如何在 HTML 中插入 CSS 樣式？優先順序是什麼？
三種在 HTML 插入 CSS 的方式
1. 外部樣式表（External Stylesheet）
<head>
<link rel="stylesheet" href="style.css">
</head>
- 最推薦的方式
- CSS 與 HTML 分離，易於維護與快取
- 多個頁面可共用同一份 CSS 檔案
2. 內部樣式（Internal / Embedded）
<head>
<style>
p { color: red; }
</style>
</head>
- 適合單頁面或特定頁面的樣式
- 無法跨頁面共用，不利快取
3. 行內樣式（Inline Style）
<p style="color: red; font-size: 16px;">文字</p>
- 直接寫在 HTML 元素的
style屬性上 - 優先度最高，但難以維護，通常不建議大量使用
CSS 優先順序（Specificity）
當多個規則套用在同一元素時，優先順序由高到低：
!important（最高，慎用）- Inline style（行內樣式）
- ID 選擇器（
#id） - Class / 屬性 / 偽類選擇器（
.class,[attr],:hover） - 元素 / 偽元素選擇器（
p,::before） - 繼承 / 瀏覽器預設樣式（最低）
若優先度相同，後定義的規則會覆蓋先定義的（就近原則）。
✦ AI 模擬面試
輸入你的答案，AI 即時分析精準度與改進空間
登入後即可使用 AI 評分