今天浅浅总结一下第二部分的基础知识，也可以巩固复习一下，防止自己忘记

CSS

CSS（层叠样式表）是用于描述网页上元素样式的一种标记语言。它可以控制网页的布局、字体、颜色、背景以及其他样式属性。

1. 语法结构：CSS由选择器和声明块组成，选择器用于选择要应用样式的元素，声明块包含一条或多条样式声明，每条声明由属性和值组成，用分号分隔。

selector 
{
   property: value;
}

2.选择器：CSS提供了多种选择器，用于选择不同的HTML元素。

• 元素选择器：使用元素名称作为选择器，p { color: red; }
• 类选择器：使用类名作为选择器，以.开头，.highlight { background-color: yellow; }
• ID选择器：使用ID作为选择器，以#开头，#logo { width: 200px; }
• 属性选择器：使用元素的属性作为选择器，input[type="text"] { border: 1px solid #ccc; }
• 伪类选择器：用于选择元素的特定状态，:hover用于鼠标悬停状态。
• 伪元素选择器：用于选择元素的特定部分，::before用于在元素前插入内容。

3.样式属性：CSS提供了很多样式属性，用于设置元素的外观和行为。

• 字体属性：font-family, font-size, font-weight, text-decoration等
• 文本属性：color ,text-align ,text-decoration ,line-height等
• 盒模型属性：width, height, margin, padding, border等
• 背景属性：background-color, background-image, background-size等
• 定位属性：position, top, right, bottom, left等

4.盒模型：CSS中的元素都被表示为一个矩形盒子，盒模型包括内容区、填充区、边框和外边距。

• 内容区：显示元素的内容，由width和height确定大小。
• 填充区：内容区与边框之间的区域，由padding确定大小。
• 边框：包围内容和填充区，由border定义样式、宽度和颜色。
• 外边距：边框和相邻元素之间的空白区域，由margin定义。

5.布局：CSS可以控制元素的布局，常用的布局技术包括：

• 流式布局：元素根据可用空间自动调整大小和位置。
• 相对定位：相对于元素原来的位置进行定位。
• 绝对定位：相对于最近的已定位祖先元素进行定位。
• 弹性盒子布局（Flexbox）：基于弹性容器和弹性项目的布局方式。
• 栅格布局（Grid）：将网页分割为行和列，实现复杂的布局。

6.响应式设计：通过使用CSS媒体查询，可以根据设备的屏幕大小和特性来适应不同的布局和样式。

    @media screen and (max-width: 768px)
    { 
    /* 在屏幕宽度小于768px时应用的样式 */ 
    }

总结

作为一种网页设计的标记语言，CSS在网页中发挥着重要的作用。学习CSS最好的方式就是通过实践。从简单的项目开始，逐渐挑战更复杂的任务。通过不断尝试和调试，我们可以深入理解CSS的工作原理和概念，并且掌握解决常见问题的技巧。我们需要保持对新技术和趋势的关注，并不断提升自己的技能。