css的十个重点知识
时间: 2024-09-11 11:01:03 浏览: 19
CSS (层叠样式表) 是一种用于描述网页元素外观和布局的语言,以下是CSS的一些核心知识点:
1. **选择器**: CSS通过各种选择器来指定要应用样式的HTML元素,如标签选择器、ID选择器、类选择器等。
2. **属性和值**: 每个CSS声明由一个属性(如`color`或`font-size`)和对应的值组成。例如,`color: red;`设置了文本颜色为红色。
3. **盒模型**: CSS的元素是由内容区域、内边距、边框和外边距构成的“盒子”。理解盒模型对于布局至关重要。
4. **定位**: `position`属性控制元素相对于文档流的位置,如`static`(默认)、`relative`、`absolute`、`fixed`等。
5. **浮动**: 浮动让元素脱离文档正常流,允许其他元素填补空隙,可用于创建行级布局。
6. **响应式设计**: 使用媒体查询(media queries)可以编写针对不同设备尺寸的CSS规则,实现适应性布局。
7. **CSS预处理器**:像Sass和Less这样的预处理器提供变量、嵌套规则等功能,提高CSS编写效率。
8. **CSS动画`: `@keyframes`规则用于创建动画,配合`animation`属性可以让元素动态变化。
9. **Flexbox 和 Grid**: 新一代的布局模式,分别为弹性盒布局(适用于一维空间)和网格布局(二维空间),能更方便地进行复杂布局。
10. **CSS模块化**: 将CSS拆分为小模块,利于团队协作和复用,有Scoped CSS(如BEM)和CSS-in-JS(如styled-components)等实践。