你好开发者社区！👋

这是我在学习 MERN 框架过程中的第 4__天。过去三天，我一直忙于用 HTML 构建 HTML 骨架。今天，我终于开始用 CSS（层叠样式表） 让那些枯燥的结构变得生动起来！

从纯白屏幕上的黑色文本切换过来感觉太棒了，可以真正控制事物的外观了。

---

🧠 第四天的关键学习

1. 添加CSS的三种方法

我了解到有三种方法可以将样式附加到HTML上，但其中一种是明显专业标准：

• 内联CSS： 在HTML标签内直接编写样式（使代码混乱）。
• 内部CSS： 在HTML头部中的<style>标签内编写样式。
• 外部CSS（胜者）： 创建一个单独的.css文件并通过<link rel="stylesheet">链接它。我选择这种方法是因为它使我的HTML保持干净和模块化。

2. CSS语法 & 基本选择器

我掌握了CSS规则的基本结构：Selector { Property: Value; }。我今天尝试了三种主要选择器：

• 元素选择器：直接定位标签（例如：body，h1）。
• 类选择器(.): 最可复用的元素样式化方式（例如：.btn-primary）。
• ID 选择器 (#): 用于样式化单个、独特的元素（例如，#main-header）。

---

🛠️ 我实际构建/样式化的内容

我拿了我昨天重构的语义"关于我"页面和导航栏，为它创建了一个外部 style.css 文件。

今天，我没有担心复杂的布局。相反，我专注于基础：

• 将页面背景色更改为干净、现代的浅灰色.
• 用不同的字体家族和深灰色调美化了我的标题.
• 将我的导航列表项(<li>)改为行内布局，使其像真正的导航栏一样水平排列，而不是垂直的列表.

---

🎯 明天的目标（第5天）

明天，我将深入探索CSS布局的绝对核心：

• 理解CSS盒子模型（外边距、边框、内边距、内容）。
• 学习元素之间的空间是如何工作的，这样我的布局就不会重叠了。

💬 一起连接吧！

致资深工程师：你们最喜欢的用于编写干净、易读代码的CSS字体堆栈是什么？致刚入门的朋友们：你们是从内联CSS开始还是直接使用外部文件？

我的样式代码和存储库在GitHub上已更新！
[评论中的链接]

继续编程！ 🚀