昨天学习了css相关课程，因此做了些笔记总结。 概念:CSS（Cascading Style Sheets）是一种用于定义网页样式的标记语言。它通过选择器和声明来描述网页元素的外观和布局。 以下是一些值得注意的影响的因素:
- 选择器
- 元素选择器：通过HTML元素名称选择元素，如
p选择所有段落。 - 类选择器：通过类名选择元素，如
.red选择所有具有red类的元素。 - ID选择器：通过元素的ID选择元素，如
#logo选择具有logoID的元素。 - 属性选择器：通过元素的属性选择元素，如
[type="text"]选择所有type属性为text的元素。 - 后代选择器：选择某个元素的后代元素，如
ul li选择ul下的所有li元素。
- 元素选择器：通过HTML元素名称选择元素，如
- 样式声明
- 属性和值：每个样式声明由一个属性和一个值组成，使用冒号分隔，如
color: red。 - 声明块：多个样式声明可以组成一个声明块，并用花括号括起来，如
{ color: red; font-size: 16px; }。 - 注释：使用
/* */来添加注释，注释不会被浏览器解析。
- 属性和值：每个样式声明由一个属性和一个值组成，使用冒号分隔，如
- 盒模型
- 内容区域：元素的实际内容，如文字、图像等。
- 内边距（padding）：内容区域与边框之间的空白区域。
- 边框（border）：包围内容区域和内边距的线条。
- 外边距（margin）：边框以外的空白区域。
- 布局和定位
- 浮动（float）：使元素向左或向右浮动，其他元素会环绕在其周围。
- 定位（position）：可以使用相对定位、绝对定位和固定定位来精确定位元素。
- 弹性盒子布局（flexbox）：一种灵活的布局方式，用于创建自适应的网页布局。
- 网格布局（grid）：将网页划分成行和列，可以方便地布局和对齐元素。
- 响应式设计
- 媒体查询（media query）：根据设备的特性（如屏幕宽度）应用不同的样式。
- 视口（viewport）：指网页在设备上的可视区域，可以通过
<meta>标签设置。 - 弹性图片（responsive images）：根据设备大小加载不同尺寸的图片，减少加载时间和带宽占用。
- 动画和过渡
- 过渡（transition）：通过改变元素的属性值实现平滑过渡效果。
- 动画（animation）：定义关键帧和动画属性，使元素实现复杂的动画效果。
- 浏览器兼容性
- 浏览器前缀：某些CSS属性在不同浏览器中需要添加特定前缀才可生效，如
-webkit-、-moz-等。 - 兼容性检查：可以使用在线工具或查阅文档来了解特定CSS属性的兼容性情况。 以上是CSS的一些基础知识。 通过学习这些知识，可以更好地掌握CSS，实现丰富多样的网页样式和布局效果。通过不断实践和尝试，加深对CSS的理解和应用。
- 浏览器前缀：某些CSS属性在不同浏览器中需要添加特定前缀才可生效，如
