CSS学习计划

CSS每周学习计划逐步掌握网页样式设计。第一周：CSS基础与选择器 1.

什么是CSS以及如何添加？理解CSS（层叠样式表）负责页面的外观。了解添加样式的3种方法：外部样式表（推荐）： <link rel="stylesheet" href="style.css"> 内部嵌入式：在 <head> 标签内的 <style> 标签中。行内（inline）：在 HTML 标签中使用 style="..." 属性。 2.

语法和基本选择器基本的CSS规则是 selektor { właściwość: wartość; } 。学习基本选择器： /* 选择器标签 */ p { color: blue; } /* 选择器类 */ .klasa-specjalna { font-weight: bold; } /* 选择器ID */ #unikalny-element { background-color: yellow; } 3.

基本属性从用于样式化文本和背景的关键属性开始： color : 文本颜色。 background-color : 元素背景颜色。 font-size : 字体大小（例如 16px , 1.2em ）。 font-family : 字体类型（例如 Arial, sans-serif ）。 font-weight : 字重（例如 bold ）。 text-align : 文本对齐（例如 center ）。第二周：盒子模型和定位 1.

盒子模型 (Box Model) 每个HTML元素都是一个矩形盒子。了解其组成部分： Content: 内容。 Padding: 内边距。 Border: 边框。 Margin: 外边距。 .box { width: 200px; padding: 20px; border: 1px solid black; margin: 10px; } 2.

display属性控制元素的显示方式： block : 占据全部可用宽度。 inline : 只占用所需的空间。 inline-block : 像 inline ，但可以为其设置宽度和高度。 none : 隐藏元素。 3.

定位理解属性对于构建布局至关重要。：默认定位。：相对于其正常位置移动元素。：相对于最近的非“静态”父级定位元素。：相对于浏览器窗口定位元素。：`relative` 和 `fixed` 的结合。第 3 周：现代布局 - Flexbox 和 Grid 1.

Flexbox 非常适合在一个维度（行或列）中排列元素。非常适用于导航和居中对齐。 2.