CSS - 属性参考

上一页
下一页

这份针对 Web 开发人员的全面参考包含了万维网联盟 (W3C) 在级联样式表 (CSS) 推荐规范中指定的所有 CSS 属性的列表。

以下是按字母顺序排列的所有 CSS 属性的列表。

属性 描述 示例
accent-color 设置用户界面上控件的突出显示颜色。
align-content 指定弹性线在弹性容器内部沿其交叉轴或网格的块轴方向如何分布。
align-items 描述弹性容器内的对象应如何对齐。
align-self 定义弹性容器内选定对象应如何对齐。
all 重置所有属性，除了 unicode-bidi 和 direction。
animation 在样式之间应用动画。所有动画属性的简写形式。
animation-delay 定义动画开始之前的暂停。
animation-direction 指定动画是否应以反向、正向或交替循环播放。
animation-duration 指示动画完成一个循环所需的时间。
animation-fill-mode 定义在动画之前和之后应用于目标元素的样式。
animation-iteration-count 定义动画应播放多少次。
animation-name 为 @keyframes 动画命名。
animation-play-state 指定动画是正在运行还是已暂停。
animation-timing-function 提供动画的速度曲线规范。
aspect-ratio 定义元素所需的纵横比。
backdrop-filter 定义对元素后面空间的视觉影响。
backface-visibility 指定当元素背面对着用户时是否应显示。
background 背景相关属性的简写形式。
background-attachment 指定背景相对于视口的位置，是固定还是可滚动。
background-clip 控制背景图像超出元素的填充或内容框的范围。
background-color 设置元素的背景颜色。
background-image 在元素上设置一个或多个背景图像。
background-origin 设置背景的原点。
background-position 设置背景中每个图像的初始位置。
background-position-x 设置背景中每个图像的初始水平位置。
background-position-y 设置背景中每个图像的初始垂直位置。
background-repeat 控制背景中图像的重复。
background-size 控制背景图像的大小。
background-blend-mode 确定元素的背景图像如何相互混合。
border 设置元素的边框。
border-block 设置逻辑块边框属性值的简写形式。
border-block-color 定义块方向（顶部和底部）边框的颜色。
border-block-end 设置逻辑块结束边框属性的简写属性。
border-block-end-color 定义元素的逻辑块结束边框的颜色。
border-block-end-style 定义元素的逻辑块结束边框的样式。
border-block-end-width 定义元素的逻辑块结束边框的宽度。
border-block-start 设置逻辑块开始边框属性的简写属性。
border-block-start-color 定义元素的逻辑块开始边框的颜色。
border-block-start-style 定义元素的逻辑块开始边框的样式。
border-block-start-width 定义元素的逻辑块开始边框的宽度。
border-block-style 定义元素的顶部和底部块边框的样式。
border-block-width 定义元素的顶部和底部块边框的宽度。
border-bottom 简写属性设置元素的底部边框。
border-bottom-color 设置元素底部边框的颜色。
border-bottom-left-radius 圆角化元素的左下角。
border-bottom-right-radius 圆角化元素的右下角。
border-bottom-style 设置底部边框的样式。
border-bottom-width 设置底部边框的宽度。
border-collapse 指定表格的边框是应分开还是合并为单个边框。
border-color 设置边框的颜色。
border-end-end-radius 定义元素的右下角边框半径。
border-end-start-radius 定义元素的左下角边框半径。
border-image 将图像设置为元素的边框。
border-image-outset 定义边框图像区域超出边框框的部分。
border-image-repeat 指定边框图像是否应拉伸、圆角或重复。
border-image-slice 将边框图像划分为区域。
border-image-source 定义将用作边框的图像的路径。
border-image-width 设置边框图像的宽度。
border-inline 设置各个逻辑内联边框属性值的简写属性。
border-inline-color 定义元素的逻辑内联边框的颜色。
border-inline-end 设置逻辑内联结束边框属性值的简写属性。
border-inline-end-color 设置逻辑内联结束边框的颜色。（右边框）
border-inline-end-style 设置逻辑内联结束边框的样式。（右边框）
border-inline-end-width 设置逻辑内联结束边框的宽度。（右边框）
border-inline-start 设置逻辑内联开始边框（左边框）属性值的简写属性。
border-inline-start-color 设置内联开始边框（左边框）的颜色。
border-inline-start-style 设置逻辑内联开始边框（左边框）的样式。
border-inline-start-width 设置逻辑内联开始边框（左边框）的宽度。
border-inline-style 定义元素的左侧和右侧内联边框的样式。
border-inline-width 定义元素的左侧和右侧内联边框的宽度。
border-left 设置元素左侧边框所有属性的简写形式。
border-left-color 定义元素左侧边框的颜色。
border-left-style 定义元素左侧边框的样式。
border-left-width 定义元素左侧边框的宽度。
border-radius 圆角化元素外边框边缘的角。
border-right 设置元素右侧边框所有属性的简写形式。
border-right-color 定义元素右侧边框的颜色。
border-right-style 定义元素右侧边框的样式。
border-right-width 定义元素右侧边框的宽度。
border-spacing 定义表格中相邻单元格边框之间的距离。
border-start-end-radius 定义元素的右上角边框圆角，位于块起始侧和内联结束侧之间。
border-start-start-radius 定义元素的左上角边框圆角，位于块起始侧和内联起始侧之间。
border-style 设置元素所有四条边框的线型。
border-top 简写属性，设置元素上边框的所有属性。
border-top-color 定义上边框的颜色。
border-top-left-radius 设置元素左上角边框的圆角。
border-top-right-radius 使元素的右上角边框圆角。
border-top-style 设置元素上边框的线型。
border-top-width 设置元素上边框的宽度。
border-width 设置元素边框的宽度。
bottom 设置元素的垂直位置。
box-decoration-break 定义元素的边框和背景在页面断裂或（对于内联元素）在换行符处将如何表现。
box-shadow 在元素周围添加阴影效果。
box-sizing 设置计算元素总宽度和高度的方式。
break-after 定义给定元素后面是否应跟随页面、列或区域断裂。
break-before 定义给定元素前面是否应出现区域、页面或列断裂。
break-inside 定义给定元素内部是否应出现页面、列或区域断裂。
caption-side 定义表格标题应放置的位置。
caret-color 定义文本区域、输入字段和其他元素中可编辑光标（插入符号）的颜色。
@charset 提供有关样式表使用的字符编码的详细信息。
clear 定义元素相对于浮动元素的行为。
clip 剪裁精确定位的元素。
clip-path 创建剪裁区域，设置要显示的元素部分。
color 定义文本的前景色。
column-count 定义元素应划分的列数。
column-fill 控制元素的内容并将其分成多列。
column-gap 定义多列布局中列之间存在的间隙大小。
column-rule 简写属性，设置多列布局中列之间绘制的线条的颜色、样式和宽度。
column-rule-color 设置多列布局中列之间绘制的线条的颜色。
column-rule-style 设置多列布局中列之间绘制的线条的样式。
column-rule-width 设置多列布局中列之间绘制的线条的宽度。
column-span 定义元素在多列布局中是否应跨越一列或所有列。
column-width 设置多列布局中的列宽。
columns 简写属性，用于设置列的宽度和数量。
content 用生成的值替换内容。
counter-increment 用于增加或减少命名 CSS 计数器的值。
counter-reset 创建命名 CSS 计数器并为其初始化特定值。
counter-set 将给定值设置为 CSS 计数器。
cursor 定义指向项目时将显示的鼠标指针。
direction 设置文本、表格列和水平溢出的方向。
display 定义特定 HTML 元素的显示方法。
empty-cells 定义是否在表格的空单元格上显示边框和背景。
filter 将图形效果应用于元素。
flex 简写属性，设置弹性项目是增长还是收缩。
flex-basis CSS flex-basis 属性在将剩余空间分配给弹性项目之前，设置弹性项目在主轴上的初始大小。
flex-direction CSS flex-direction 属性确定弹性项目在弹性容器内放置的方向。（水平和垂直）
flex-flow 简写属性，用于指定弹性容器的方向和换行行为。
flex-grow 确定弹性项目在其主轴上应占用多少额外空间。
flex-shrink 定义项目相对于其他项目的收缩。
flex-wrap CSS flex-wrap 属性确定弹性项目是保持在一行上，还是根据可用空间允许换行到多行上。
float 将元素放置在其容器的左侧或右侧。
font 简写属性，用于设置所有与字体相关的属性。
font-family 定义文本的字体系列。
font-feature-settings 用于启用或禁用特定的 OpenType 字体功能，这些功能控制使用连字、字距调整、风格集等高级字体功能如何呈现文本。
font-kerning 确定如何使用字距调整信息（字母之间的间距）。
font-language-override 用于调整字形和功能的渲染以匹配不同语言的语言需求。
font-size 确定文本的字体大小。
font-size-adjust 在字体回退的情况下保持文本的可读性。
font-stretch 选择字体的标准、紧缩或扩展字体。
font-style 设置文本的字体样式。
font-synthesis 确定浏览器是否应合成字体系列中缺少的样式。
font-variant 设置字体的所有字体变体。
font-variant-alternate 控制备用字形的用法。
font-variant-caps 控制用于小写字母的备用字形的用法。
font-variant-east-asian 规范东亚文字（如中文和日文）的备用字形的用法。
font-variant-ligatures 规范上下文形式和连字的用法。
font-variant-numeric 规范序数标记、分数和整数的不同字形的用法。
font-variant-position 规范作为上标或下标定位的较小备用字形的用法。
font-weight 指定字体的粗细。
gap 简写属性，用于设置网格布局系统中行和列的间隙（也用于在文本的多列布局中添加间隙）。
grid 简写属性，用于在一个声明中设置所有与网格相关的属性。
grid-area 简写属性，指定网格项目在网格内的尺寸和位置。
grid-auto-columns 定义列的默认大小。
grid-auto-flow 定义网格自动放置的项目插入过程。
grid-auto-rows 定义行的默认大小。
grid-column 简写属性，指定网格项目在网格列内的尺寸和位置。
grid-column-end 定义网格项目在网格列内的结束点。
grid-column-start 定义网格项目在网格列内的起始点。
grid-row 简写属性，指定网格项目在网格行内的尺寸和位置。
grid-row-end 指定网格项目在网格行内的结束点。
grid-row-gap 以大小的形式定义行之间的间隙。
grid-row-start 指定网格项目在网格行内的起始点。
grid-template 简写属性，指定与网格列、网格行和网格区域相关的属性。
grid-template-areas 定义命名网格项目及其在显示列和行中的用法。
grid-template-columns 定义网格布局中列的数量和大小。
grid-template-rows 定义网格布局中行的尺寸。
height 定义元素的高度。
hyphens 定义如何划分单词以增强文本布局。
hyphenate-character 用于更改默认连字符字符（-）。
image-rendering 定义要使用的图像缩放方法的类型。
inline-size 定义元素块的水平和垂直大小。
inset 指示元素与其父元素边缘的距离。
inset-block 定义元素的逻辑块起始和结束偏移量。
inset-block-end 定义元素的逻辑块结束偏移量。
inset-block-start 定义元素的逻辑块起始偏移量。
inset-inline 定义元素在内联方向上的逻辑起始和结束偏移量。
inset-inline-end 定义元素的结束与其父元素之间的距离（以内联方向测量）。
inset-inline-start 定义元素的开始与其父元素之间的距离（以内联方向测量）。
isolation 定义元素是否必须创建新的堆叠内容。
justify-content 定义如何在弹性容器和网格容器中内容项目之间和周围分配空间。
justify-items 定义网格元素应如何在网格容器内的水平轴上对齐。
justify-self 定义网格项目应如何在位于网格容器内的内联方向上对齐。
@keyframes 定义动画或过渡的一组关键帧。
left 定义元素的水平位置。
letter-spacing 设置文本字符之间的水平间距。
line-break 定义是否以及如何换行东亚文字。
line-height 定义行框的高度。
list-style 简写属性，用于在一个声明中设置所有列表样式属性。
list-style-image 将图像设置为列表项标记。
list-style-position 设置列表中标记的位置。
list-style-type 定义列表项标记的类型。
margin 简写属性，用于设置元素所有四边的边距。
margin-block 简写属性，定义元素的逻辑块起始和结束边距。
margin-block-end 设置元素在块方向末尾的边距空间。
margin-block-start 设置元素在块方向起始处的边距空间。
margin-bottom 设置元素底部的边距区域。
margin-inline 定义元素的逻辑内联起始和结束边距。
margin-inline-end 定义元素的逻辑内联结束边距。
margin-inline-start 定义元素的逻辑内联起始边距。
margin-left 设置元素左侧的边距区域。
margin-right 设置元素右侧的边距区域。
margin-top 设置元素顶部的边距。
mask 在特定点遮罩或剪裁图像以隐藏元素（部分或全部）。
mask-clip 确定遮罩覆盖的区域。
mask-composite

 在执行合成操作后，显示当前蒙版层下方的蒙版层。
mask-image 设置用作元素蒙版层的图像。
mask-mode 定义由 mask-image 给出的蒙版参考应被视为亮度蒙版还是 alpha 蒙版。
mask-origin 定义蒙版图像的原点。
mask-position 定义蒙版图像在元素中的定位。
mask-repeat 定义如何在元素内重复蒙版图像。
mask-size 定义应用于使用 mask-image 属性的元素的蒙版图像的大小。
mask-type 将 SVG <mask> 元素设置为亮度蒙版或 alpha 蒙版。
max-height 设置元素在布局中占据的最大高度。
max-width 设置元素在布局中占据的最大宽度。
@media 为特定的媒体类型、设备和尺寸设置 CSS 样式规则。
max-block-size 设置元素在其书写方向相反方向上的最大尺寸。
max-inline-size 定义元素块的水平或垂直最大尺寸。
min-block-size 根据元素的书写模式，设置元素块的最小尺寸（水平或垂直）。
min-inline-size 定义元素块的最小水平或垂直尺寸。
min-height 设置元素高度的下限。
min-width 设置元素宽度的下限。
mix-blend-mode 定义元素内容应如何与其父元素的内容和元素的背景混合。
object-fit 定义图像或视频应如何调整大小或裁剪以适应其容器。
object-position 定义具有定义大小的元素内部内容的位置。
offset 用于在容器中定位元素的简写属性。
offset-anchor 定义沿 offset-path 移动的框内元素的移动位置。
offset-distance 定义应放置元素的 offset-path 上的位置。
offset-path 定义元素在其父容器或 SVG 坐标系中的路径。
offset-rotate 定义元素沿指定的 offset-path 移动时的方向或方向。
opacity 设置元素的透明度。
order 定义弹性项目在弹性容器中出现的顺序。
orphans 定义页面、区域或列底部所需的最小行数，以防止断开。
outline 设置元素周围轮廓的宽度、颜色和样式。轮廓用于在元素获得焦点时突出显示元素。
outline-color 设置元素周围轮廓的颜色。
outline-offset 定义轮廓与元素边框边缘之间的空间。
outline-style 确定元素周围轮廓的样式。
outline-width 定义元素周围轮廓的宽度。
overflow 定义如何处理超出其容器边界的內容。
overflow-anchor 提供一种禁用浏览器滚动锚定行为的方法，该行为会调整滚动位置以减少内容偏移。
overflow-wrap 允许浏览器将一行文本拆分为一个不可分割的字符串，以防止内容溢出其容器。
overflow-clip-margin 定义内容在被裁剪之前可以超出元素框的距离。
overflow-x 定义元素的内容将溢出到其左右边距以及水平方向。
overflow-y 定义当块级元素的内容超出元素的顶部和底部边缘时如何显示。
overflow-block 定义当元素的内容超出其框的左右边界时，内容的行为。
overflow-inline 定义当内容溢出元素的内联边缘时如何显示溢出的内容。
overscroll-behavior 确定浏览器在到达滚动区域边界时执行的操作。
overscroll-behavior-block 确定浏览器在到达滚动区域的块方向边界时执行的操作。
overscroll-behavior-inline 确定浏览器在到达滚动区域的内联方向边界时执行的操作。
overscroll-behavior-x 确定浏览器在到达滚动区域的水平边界时执行的操作。
overscroll-behavior-y 确定浏览器在到达滚动区域的垂直边界时执行的操作。
padding 定义元素所有侧边填充的简写属性。
padding-block 确定元素的逻辑块起始和结束填充。
padding-block-end 确定元素的逻辑块结束填充。
padding-block-start 设置元素底部填充的宽度。
padding-bottom 设置元素底部填充的宽度。
padding-inline 确定元素的逻辑内联起始和结束填充。
padding-inline-end 确定元素的逻辑内联结束填充。
padding-inline-start 确定元素的逻辑内联开始填充。
padding-left 设置元素左侧的填充空间。
padding-right 设置元素右侧的填充空间。
padding-top 设置元素顶部的填充空间。
perspective 定义 z=0 平面与用户之间的距离。
perspective-origin 定义查看者/用户正在查看的位置。
place-content 同时在块（列）和内联（行）轴上对齐内容。它是 align-content 和 justify-content 属性的简写。
place-items 沿块（列）和内联（行）轴同时对齐网格和弹性盒容器内的项目。它是 align-items 和 justify-items 属性的简写。
place-self 同时在块和内联方向上对齐单个项目。它是 align-self 和 justify-self 属性的简写。
pointer-events 确定元素是否接收指针事件。
position 定义元素在网页上的位置。
quotes 定义用于嵌入引号的引号样式。
resize 定义用户是否以及如何调整元素的大小。
right 控制元素的水平位置。
rotate 定义元素旋转的方式。
row-gap 定义网格行之间的间隙。也用于在多列布局中添加列之间的间隙。
scale 指定元素的缩放变换，独立于 transform 属性。
scroll-behavior 定义当用户点击链接或使用滚动条时浏览器滚动时的平滑程度。
scroll-margin 定义元素在捕捉区域内的边距。
scroll-margin-block 定义块轴上滚动捕捉区域边距的简写属性。
scroll-margin-block-end 定义块轴末端滚动捕捉区域的边距。
scroll-margin-block-start 定义块轴起始处滚动捕捉区域的边距。
scroll-margin-bottom 定义滚动容器底部的边距。
scroll-margin-inline 设置元素在线（水平轴）尺寸上的滚动边距。
scroll-margin-inline-end 定义水平尺寸末端滚动捕捉区域的边距。
scroll-margin-inline-start 定义水平尺寸起始处滚动捕捉区域的边距。
scroll-margin-left 定义元素滚动捕捉区域的左边距。
scroll-margin-top 定义元素滚动捕捉区域的顶部边距。
scroll-margin-right 定义元素滚动捕捉区域的右边距。
scroll-padding 定义滚动容器边缘与元素捕捉区域（滚动停止后捕捉到位）之间的滚动填充。
scroll-padding-block 定义元素在块尺寸上的滚动填充。
scroll-padding-block-start 定义元素在块尺寸上滚动填充的起始边缘的偏移量。
scroll-padding-block-end 定义元素在块尺寸上滚动填充的结束边缘的偏移量。
scroll-padding-bottom 定义元素滚动捕捉区域的底部偏移量。
scroll-padding-left 定义滚动容器左边缘与元素滚动捕捉区域之间的空间量。
scroll-padding-right 定义滚动容器右边缘与元素滚动捕捉区域之间的空间量。
scroll-padding-top 定义元素滚动捕捉区域的顶部偏移量。
scroll-padding-inline 定义元素在内联尺寸上的滚动填充。
scroll-padding-inline-start 定义视口起始边缘的偏移量，在内联尺寸上。
scroll-padding-inline-end 定义视口结束边缘的偏移量，在内联尺寸上。
scroll-snap-align 定义捕捉元素在其捕捉容器内如何定位。
scroll-snap-shot 确定滚动容器是否会滚动超过或粘贴到最近的捕捉位置。
scroll-snap-type 定义滚动容器如何捕捉到捕捉位置。
scrollbar-color 定义滚动条轨道和滑块的颜色。
scrollbar-width 用于设置滚动条轨道和滑块的宽度样式。
scrollbar-gutter 它有助于为滚动条创建固定空间。
shape-image-threshold 当使用具有 shape-outside 属性的图像时，指定形状提取的 alpha 通道阈值。
shape-margin 定义指定 CSS 形状周围的边距。
shape-outside 定义内联内容应围绕其环绕的形状。
tab-size 定义元素内制表符字符的宽度。
table-layout 定义 <table> 单元格、行和列的显示方式。
text-align 定义文本与页面边距的对齐方式。
text-align-last 设置块的最后一行或强制换行符之前的行的对齐方式。
text-combine-upright 定义如何将多个字符放入单个字符的区域中。
text-decoration 定义添加到文本的装饰。
text-decoration-color 定义文本装饰的颜色。
text-decoration-line 用于向文本添加装饰线。
text-decoration-style 用于向文本装饰线添加样式。
text-decoration-thickness 用于向文本装饰线添加粗细。
text-emphasis 用于向文本添加强调的简写属性。
text-emphasis-color 用于设置文本周围强调标记的颜色。
text-emphasis-position 用于设置文本周围强调标记的位置。
text-emphasis-style 定义强调标记的外观。
text-indent 定义文本第一行的缩进。
text-justify 当 text-align 设置为“justify”时，指定文本的对齐方法。
text-orientation 定义一行中文本字符的方向。
text-overflow 控制如何向用户显示隐藏的溢出内容。
text-shadow 用于向文本添加阴影效果。
text-transform 通过以各种方式转换文本，更改文本的外观。
text-underline-offset 定义下划线文本装饰线与其初始位置的距离。
text-underline-position 定义下划线文本装饰应放置的位置。
top 定义元素相对于其包含元素的垂直位置。
transform 它可用于元素的旋转、缩放、倾斜或平移。
transform-box 定义转换属性相关的布局框。
transform-origin 有助于设置元素转换的原点。
transform-style 定义嵌套项目的 3D 空间渲染。
transition 一个充当每个转换属性简写的属性。
transition-delay 定义在开始转换效果之前要等待的时间量。
transition-duration 定义转换动画完成所需的时间量。
transition-property 定义哪些 CSS 属性应应用转换效果。
transition-timing-function 定义转换效果的速度曲线。
translate 允许您沿 X、Y 和 Z 轴移动元素。
unicode-bidi 控制如何在文档中显示双向文本。
user-select 确定用户是否可以选择文本。
vertical-align 定义元素的垂直对齐方式。
visibility 定义是否需要显示或隐藏元素，而不会更改文档的布局。
white-space 定义元素中文本内的空白流。
widows 定义页面或列顶部必须剩余多少行。
width 定义元素内容区域的宽度。
word-break 定义如果单词超过元素的可用宽度，则应如何断开或换行。
word-spacing 定义文本中单词之间的间距。
writing-mode 定义文本应垂直显示还是水平显示。
z-index 控制网页中元素的堆叠顺序。
未找到结果
打印页面
上一页
下一页
广告