第6话：建造 - CSS 漫画大冒险

三种建造方式

🏗️

The Builder (建筑师):
大卫，我要怎么把你的装饰放到我的建筑里？
我们有三种蓝图。

🧑‍🦱

Young David (少年大卫):
只有一种是荣耀的圣殿。其他的只是临时的帐棚。

1. 外部样式表 (External)

🏛️

推荐指数：⭐⭐⭐⭐⭐

把律法写在独立的 .css 卷轴里。圣洁、整洁、可传承。

2. 内部样式表 (Internal)

⛺

推荐指数：⭐⭐⭐

把律法写在门楣 (Head) 上。适合小型会幕。

3. 内联样式 (Inline)

💉

推荐指数：⭐ (禁止使用)

直接把律法刻在每块石头上。非常混乱，难以修缮！

小狐狸的涂鸦

🦊

Little Fox (小狐狸):
我才不要写那么多卷轴！
我要把画直接画在墙上！这样最快了！
看我的 Style 贴纸！

                <h1 style="color: red; font-size: 50px; margin: 10px;">...</h1>

                <h1 style="color: red; font-size: 50px; margin: 10px;">...</h1>

                <h1 style="color: red; font-size: 50px; margin: 10px;">...</h1>

                // 想象一下你有 1000 个这样的柱子要修改！

🧑‍🦱

Young David (少年大卫):
小狐狸！如果你要把红色改成蓝色，你得改 1000 次！
这就是为什么我们叫它苦工的地狱。

终极连接 (Link)

在 HTML 的 <head> 部分加入这行代码，就能连接无限的能力：

<head>
    <link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

权柄规则 (Priority):
小狐狸的内联样式权柄最高（就像刻在身上的纹身，很难洗掉）。
但我们可以用 !important 来强制洁净（慎用，那是大祭司的权柄！）。

⚔️ 操练场 (Training Ground)

任务： 帮助建筑师选择最完美的建造蓝图。

问题：如果你有 100 个网页，它们都使用相同的样式。你应该用哪种方式？

◀ 上一课下一课：涂油 (背景) ▶