1. CSS 属性分类

CSS 的属性是多种多样的，为了更好地理解和使用，可以将所有的 CSS 属性根据功能进行分类。以下是 CSS 属性的常见分类，并详细列出了每个分类中的属性。

CSS 属性可以分为以下 14 个主要分类：

1. 颜色与背景

用于设置元素的颜色和背景样式。

颜色相关：
- color
- opacity
背景相关：
- background
- background-color
- background-image
- background-repeat
- background-size
- background-position
- background-attachment
- background-clip
- background-origin

2. 文本与字体

控制文本的样式、字体和排版。

字体：
- font
- font-family
- font-size
- font-weight
- font-style
- font-variant
- font-size-adjust
- font-stretch
文本样式：
- text-decoration
- text-decoration-line
- text-decoration-color
- text-decoration-style
- text-transform
- text-shadow
- letter-spacing
- line-height
- white-space
- word-spacing
- word-break
- word-wrap
- hyphens
- direction
- writing-mode
- unicode-bidi

3. 盒模型

用于设置元素的大小、边距、内边距和边框。

宽高：
- width
- height
- max-width
- min-width
- max-height
- min-height
边距：
- margin
- margin-top
- margin-right
- margin-bottom
- margin-left
内边距：
- padding
- padding-top
- padding-right
- padding-bottom
- padding-left
边框：
- border
- border-width
- border-style
- border-color
- border-top
- border-right
- border-bottom
- border-left
- border-top-width
- border-right-width
- border-bottom-width
- border-left-width
- border-top-color
- border-right-color
- border-bottom-color
- border-left-color
- border-top-style
- border-right-style
- border-bottom-style
- border-left-style
其他边框属性：
- border-radius
- border-image
- border-image-source
- border-image-slice
- border-image-width
- border-image-outset
- border-image-repeat
- box-sizing

4. 定位与布局

控制元素在页面中的布局和位置。

定位：
- position
- top
- right
- bottom
- left
浮动：
- float
- clear
显示与可见性：
- display
- visibility
- z-index
- overflow
- overflow-x
- overflow-y
剪裁：
- clip
- clip-path
表格布局：
- table-layout
- empty-cells
- border-spacing
- border-collapse
- caption-side
弹性盒子（Flexbox）：
- display: flex
- flex-direction
- flex-wrap
- justify-content
- align-items
- align-content
- order
- flex
- flex-grow
- flex-shrink
- flex-basis
- align-self
网格布局（Grid）：
- display: grid
- grid-template-columns
- grid-template-rows
- grid-template-areas
- grid-column
- grid-row
- grid-area
- grid-gap
- grid-column-gap
- grid-row-gap
- justify-items
- align-items
- place-items

5. 动画和过渡

用于定义动画效果和过渡效果。

动画：
- animation
- animation-name
- animation-duration
- animation-timing-function
- animation-delay
- animation-iteration-count
- animation-direction
- animation-fill-mode
- animation-play-state
过渡：
- transition
- transition-property
- transition-duration
- transition-timing-function
- transition-delay

6. 变形（Transform）

用于对元素进行平移、旋转、缩放和倾斜等变换。

2D 变换：
- transform
- transform-origin
3D 变换：
- perspective
- perspective-origin
- transform-style
- backface-visibility

7. 滤镜（Filter）

用于为元素应用各种视觉效果。

filter
backdrop-filter

常见效果：

blur
brightness
contrast
grayscale
hue-rotate
invert
opacity
saturate
sepia

8. 多列布局

用于创建多列布局。

column-count
column-gap
column-width
column-rule
column-rule-width
column-rule-style
column-rule-color

9. 光标样式

控制鼠标指针在元素上的样式。

cursor

10. 列表样式

控制列表项的样式。

list-style
list-style-type
list-style-position
list-style-image

11. 生成内容

用于添加生成内容。

content
quotes
counter-reset
counter-increment

12. 阴影

用于设置元素的阴影效果。

box-shadow
text-shadow

13. 滚动行为

用于控制滚动条样式和滚动行为。

scroll-behavior
overscroll-behavior
scroll-margin
scroll-padding

14. 其他属性

一些通用或特殊用途的属性。

clip
resize
pointer-events
will-change

2. 总结

CSS 属性可以分为 14 个主要分类：

颜色与背景
文本与字体
盒模型
定位与布局
动画和过渡
变形（Transform）
滤镜（Filter）
多列布局
光标样式
列表样式
生成内容
阴影
滚动行为
其他属性

通过掌握这些分类，可以更有条理地学习和使用 CSS 属性，在项目中快速找到所需要的样式属性。