CSS（层叠样式表）常用网页元素的样式。

1.字体和文本属性：

font-family: 设置字体系列。
font-size: 设置字体大小。
font-weight: 设置字体粗细。
font-style: 设置字体风格（如斜体）。
text-align: 设置文本对齐方式。
text-decoration: 设置文本装饰（如下划线）。
text-transform: 控制文本大小写。
line-height: 设置行高。
color: 设置文本颜色。

2.背景属性：

background-color: 设置背景颜色。
background-image: 设置背景图像。
background-repeat: 设置背景图像是否重复。
background-position: 设置背景图像的位置。
background-size: 设置背景图像的大小。
background-clip: 设置背景的绘制区域。

3.边框属性：

border: 简写属性，用于设置边框的样式、宽度和颜色。
border-width: 设置边框的宽度。
border-style: 设置边框的样式（如实线、虚线）。
border-color: 设置边框的颜色。
border-radius: 设置边框圆角。

4.边距和填充属性：

margin: 简写属性，用于设置元素的外边距。
margin-top, margin-right, margin-bottom, margin-left: 分别设置元素的上、右、下、左边距。
padding: 简写属性，用于设置元素的内边距。
padding-top, padding-right, padding-bottom, padding-left: 分别设置元素的上、右、下、内边距。

5.布局属性：

display: 设置元素的显示类型（如块级、行内、表格等）。
width, height: 分别设置元素的宽度和高度。
max-width, max-height: 设置元素的最大宽度和高度。
min-width, min-height: 设置元素的最小宽度和高度。
overflow: 设置如何处理溢出元素盒子的内容。

6.定位属性：

position: 设置元素的定位方式（如静态、相对、绝对、固定）。
top, right, bottom, left: 设置元素相对于其正常位置的偏移。
Flexbox 布局属性：

display: flex;: 启用 Flexbox 布局。
flex-direction: 设置 Flex 容器中项目的方向。
justify-content: 设置 Flex 容器中项目在主轴上的对齐方式。
align-items: 设置 Flex 容器中项目在交叉轴上的对齐方式。
flex-wrap: 设置 Flex 容器中的项目是否折行。

7.Grid 布局属性：

display: grid;: 启用 Grid 布局。
grid-template-columns: 设置 Grid 布局的列。
grid-template-rows: 设置 Grid 布局的行。
grid-column-gap, grid-row-gap: 设置 Grid 布局的列间距和行间距。
justify-items, align-items: 设置 Grid 项目在网格区域的对齐方式。

8.变换属性：

transform: 应用 2D 或 3D 转换。
transition: 设置过渡效果，用于在属性值变化时创建动画。

9.动画属性：

animation: 简写属性，用于设置动画的名称、持续时间、时序函数等。

10.盒模型相关属性：

box-sizing: 设置盒模型的计算方式（如内容盒模型或边框盒模型）。

这些属性是 CSS 布局和样式设计的基础，通过它们可以创建丰富多样的网页效果。随着 CSS 的不断发展，还有更多的高级属性和功能被引入，以支持更复杂的设计需求。