📅 最后修改于: 2023-12-03 14:40:19.224000 🧑 作者: Mango
CSS是一种用于为网页添加样式的语言。在CSS中，属性用于设置元素的样式，例如其颜色、宽度、高度、边框等。本文将提供一个CSS属性完整参考，涵盖了Web开发中所有可能用到的CSS属性。
background用于设置元素的背景颜色和图像。
background: [color] [image] [repeat] [attachment] [position];
color：可选，用于设置背景颜色。image：可选，用于设置背景图片的URL。repeat：可选，用于设置背景图片的重复方式。attachment：可选，用于指定背景图片的滚动方式（固定或跟随）。position：可选，用于设置背景图片的位置。color用于设置文本颜色。
color: [color];
color：必需，用于设置文本颜色。font-family用于设置字体。
font-family: [family name], [fallback fonts];
family name：必需，用于指定字体的名称。fallback fonts：可选，用于指定备选字体，若浏览器无法加载第一个字体则会使用备选字体。font-size用于设置字体大小。
font-size: [size];
size：必需，用于设置字体大小。font-style用于设置字体样式。
font-style: [normal|italic|oblique];
normal：默认字体样式。italic：倾斜字体样式。oblique：倾斜字体样式。font-weight用于设置字体粗细。
font-weight: [normal|bold|lighter|bolder|100|200|300|400|500|600|700|800|900];
normal：默认字体粗细。bold：加粗字体粗细。lighter：比默认字体更细的粗细。bolder：比默认字体更粗的粗细。100-900：用数字表示的字体粗细。text-align用于设置文本对齐方式。
text-align: [left|right|center|justify];
left：左对齐。right：右对齐。center：居中对齐。justify：两端对齐。text-decoration用于设置文本修饰。
text-decoration: [none|underline|overline|line-through];
none：默认无修饰。underline：下划线。overline：上划线。line-through：中划线。text-transform用于设置文本转换。
text-transform: [none|capitalize|uppercase|lowercase];
none：默认无转换。capitalize：将每个单词的首字母变为大写。uppercase：将所有字母变为大写。lowercase：将所有字母变为小写。line-height用于设置行高。
line-height: [number|length|initial|inherit];
number：根据字体计算的行高比例。length：以固定长度为行高。initial：默认行高。inherit：继承父元素的行高。letter-spacing用于设置字符间距。
letter-spacing: [normal|length];
normal：默认字符间距。length：字符间距的长度值。word-spacing用于设置单词间距。
word-spacing: [normal|length];
normal：默认单词间距。length：单词间距的长度值。text-shadow用于设置文本阴影效果。
text-shadow: [h-shadow] [v-shadow] [blur] [color];
h-shadow：必需，水平阴影距离。v-shadow：必需，垂直阴影距离。blur：可选，阴影模糊半径。color：可选，阴影颜色。cursor用于设置鼠标指针的显示。
cursor: [value];
value：必需，鼠标指针的显示方式。例如：auto, default, none, context-menu, help, pointer, progress, wait, cell, crosshair, text, vertical-text, alias, copy, move, no-drop, not-allowed, grab, grabbing, e-resize, n-resize, ne-resize, nw-resize, s-resize, se-resize, sw-resize, w-resize, ew-resize, ns-resize, nesw-resize, nwse-resize, col-resize, row-resize, all-scroll, zoom-in, zoom-out.display用于设置元素的显示方式。
display: [value];
value：必需，用于设置元素的显示方式。例如：none, block, inline, inline-block, flex, grid, table, table-row, table-cell, list-item.float用于设置元素的浮动方式。
float: [left|right|none];
left：元素向左浮动。right：元素向右浮动。none：元素不浮动。clear用于清除浮动。
clear: [left|right|both];
left：清除元素左侧的浮动。right：清除元素右侧的浮动。both：清除元素两侧的浮动。position用于设置元素的定位方式。
position: [static|relative|absolute|fixed|sticky];
static：默认定位方式。relative：相对定位。absolute：绝对定位。fixed：固定定位。sticky：粘性定位。top用于设置元素的顶部边距。
top: [value];
value：必需，用于设置元素的上外边距。bottom用于设置元素的底部边距。
bottom: [value];
value：必需，用于设置元素的下外边距。left用于设置元素的左侧边距。
left: [value];
value：必需，用于设置元素的左外边距。right用于设置元素的右侧边距。
right: [value];
value：必需，用于设置元素的右外边距。margin用于设置元素的外边距。
margin: [top] [right] [bottom] [left];
margin: [vertical] [horizontal];
margin: [value];
[top] [right] [bottom] [left]：设置每个方向的外边距。[vertical] [horizontal]：设置垂直和水平方向上的外边距。[value]：统一设置四个方向的外边距。padding用于设置元素的内边距。
padding: [top] [right] [bottom] [left];
padding: [vertical] [horizontal];
padding: [value];
[top] [right] [bottom] [left]：设置每个方向的内边距。[vertical] [horizontal]：设置垂直和水平方向上的内边距。[value]：统一设置四个方向的内边距。width用于设置元素的宽度。
width: [value];
value：必需，用于设置元素的宽度。height用于设置元素的高度。
height: [value];
value：必需，用于设置元素的高度。max-width用于设置元素的最大宽度。
max-width: [value];
value：必需，用于设置元素的最大宽度。max-height用于设置元素的最大高度。
max-height: [value];
value：必需，用于设置元素的最大高度。min-width用于设置元素的最小宽度。
min-width: [value];
value：必需，用于设置元素的最小宽度。min-height用于设置元素的最小高度。
min-height: [value];
value：必需，用于设置元素的最小高度。border用于设置元素的边框。
border: [width] [style] [color];
width：可选，用于设置边框的宽度（如果未设置样式的话）。style：可选，用于设置边框的样式。color：可选，用于设置边框的颜色。border-width用于设置边框的宽度。
border-width: [top] [right] [bottom] [left];
border-width: [value];
[top] [right] [bottom] [left]：设置每个方向的边框宽度。[value]：统一设置四个方向的边框宽度。border-style用于设置边框的样式。
border-style: [top] [right] [bottom] [left];
border-style: [value];
[top] [right] [bottom] [left]：设置每个方向的边框样式。[value]：统一设置四个方向的边框样式。border-color用于设置边框的颜色。
border-color: [top] [right] [bottom] [left];
border-color: [value];
[top] [right] [bottom] [left]：设置每个方向的边框颜色。[value]：统一设置四个方向的边框颜色。border-radius用于设置边框的圆角半径。
border-radius: [top-left-radius] [top-right-radius] [bottom-right-radius] [bottom-left-radius];
border-radius: [value];
[top-left-radius] [top-right-radius] [bottom-right-radius] [bottom-left-radius]：设置每个角的圆角半径。[value]：统一设置四个角的圆角半径。background-color用于设置元素的背景颜色。
background-color: [color];
color：必需，用于设置元素的背景颜色。background-image用于设置元素的背景图片。
background-image: [url];
url：必需，用于指定背景图片的URL。background-repeat用于设置背景图片的重复方式。
background-repeat: [repeat|repeat-x|repeat-y|no-repeat];
repeat：默认方式，横向和竖向都重复。repeat-x：只在横向重复。repeat-y：只在竖向重复。no-repeat：不重复。background-attachment用于指定背景图片的滚动方式（固定或跟随）。
background-attachment: [scroll|fixed];
scroll：默认方式，背景图片会跟随页面滚动。fixed：固定方式，背景图片不会随页面滚动。background-position用于设置背景图片的位置。
background-position: [left|center|right] [top|center|bottom];
left|center|right：可选，用于设置背景图片在横向上的位置。top|center|bottom：可选，用于设置背景图片在纵向上的位置。opacity用于设置元素的透明度。
opacity: [value];
value：必需，取值0-1之间，表示透明度的百分比。z-index用于设置元素的堆叠顺序。
z-index: [value];
value：必需，表示元素的堆叠顺序，取值为整数。overflow用于设置元素的溢出内容的处理方式。
overflow: [visible|hidden|scroll|auto];
visible：默认处理方式，溢出内容不做任何处理。hidden：隐藏溢出的内容。scroll：显示滚动条，可以滚动显示溢出内容。auto：只有在需要滚动时才显示滚动条。以上就是CSS属性完整参考的介绍。使用这些属性，你可以设置元素的样式，布局和背景等，并实现你所需要的页面效果。