CSS3 属性
以下部分包含 CSS3 属性列表以及简要说明。
CSS 属性按类别排序
以下部分包含属于最新 CSS3 规范的标准属性的完整列表。 所有属性都按字母顺序列出。
属性 | 说明 |
---|---|
align-content |
指定弹性容器的项目在弹性容器内的对齐方式。 |
align-items |
指定 flex 容器中项目的默认对齐方式。 |
align-self |
指定 flex 容器中选定项目的对齐方式。 |
animation |
指定基于关键帧的动画。 |
animation-delay |
指定动画何时开始。 |
animation-direction |
指定动画是否应在交替循环中反向播放。 |
animation-duration |
指定动画完成一个周期所需的秒数或毫秒数。 |
animation-fill-mode |
指定 CSS 动画在执行前后应如何将样式应用于其目标。 |
animation-iteration-count |
指定动画循环在停止之前应播放的次数。 |
animation-name |
指定应应用于所选元素的 @keyframes 定义的动画的名称。 |
animation-play-state |
指定动画是正在运行还是暂停。 |
animation-timing-function |
指定 CSS 动画在每个循环期间应如何进行。 |
backface-visibility |
指定当面向用户时变换元素的“背面”是否可见。 |
background |
在一个声明中定义多种背景属性。 |
background-attachment |
指定背景图像是固定在视口中还是滚动。 |
background-clip |
指定背景的绘画区域。 |
background-color |
定义元素的背景颜色。 |
background-image |
定义元素的背景图片。 |
background-origin |
指定背景图片的定位区域。 |
background-position |
定义背景图像的来源。 |
background-repeat |
指定背景图像是否/如何平铺。 |
background-size |
指定背景图像的大小。 |
border |
设置元素边框的所有四个边的宽度、样式和颜色。 |
border-bottom |
设置元素下边框的宽度、样式和颜色。 |
border-bottom-color |
设置元素下边框的颜色。 |
border-bottom-left-radius |
定义元素左下角边框的形状。 |
border-bottom-right-radius |
定义元素右下角边框的形状。 |
border-bottom-style |
设置元素下边框的样式。 |
border-bottom-width |
设置元素下边框的宽度。 |
border-collapse |
指定表格单元格边框是连接还是分开。 |
border-color |
设置元素所有四个边的边框颜色。 |
border-image |
指定如何使用图像代替边框样式。 |
border-image-outset |
指定边框图像区域超出边框框的量。 |
border-image-repeat |
指定图像边框是否应重复、圆角或拉伸。 |
border-image-slice |
指定图像边框的向内偏移量。 |
border-image-source |
指定要用作边框的图像的位置。 |
border-image-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-style |
设置元素所有四个边的边框样式。 |
border-top |
设置元素上边框的宽度、样式和颜色。 |
border-top-color |
设置元素上边框的颜色。 |
border-top-left-radius |
定义元素左上角边框的形状。 |
border-top-right-radius |
定义元素右上角边框的形状。 |
border-top-style |
设置元素上边框的样式。 |
border-top-width |
设置元素上边框的宽度。 |
border-width |
设置元素所有四个边的边框宽度。 |
bottom |
指定定位元素下边缘的位置。 |
box-shadow |
将一个或多个阴影应用到元素的框。 |
box-sizing |
更改默认 CSS 框模型。 |
caption-side |
指定表格标题的位置。 |
clear |
指定元素相对于浮动元素的位置。 |
clip |
定义剪辑区域。 |
color |
指定元素文本的颜色。 |
column-count |
指定多列元素中的列数。 |
column-fill |
指定如何填充列。 |
column-gap |
指定多列元素中的列之间的间距。 |
column-rule |
指定要在多列元素中的每列之间绘制的直线或“规则”。 |
column-rule-color |
指定在多列布局中的列之间绘制的规则的颜色。 |
column-rule-style |
指定在多列布局中的列之间绘制的规则样式。 |
column-rule-width |
指定在多列布局中的列之间绘制的规则的宽度。 |
column-span |
指定一个元素在多列布局中跨越多少列。 |
column-width |
指定多列元素中列的最佳宽度。 |
columns |
用于设置 column-width 和 column-count 属性的简写属性。 |
content |
插入生成的内容。 |
counter-increment |
增加一个或多个计数器值。 |
counter-reset |
创建或重置一个或多个计数器。 |
cursor |
指定光标的类型。 |
direction |
定义文字方向/书写方向。 |
display |
指定元素在屏幕上的显示方式。 |
empty-cells |
显示或隐藏空表格单元格的边框和背景。 |
flex |
指定灵活长度的组件。 |
flex-basis |
指定弹性项目的初始主尺寸。 |
flex-direction |
指定灵活项的方向。 |
flex-flow |
flex-direction 和 flex-wrap 属性的简写属性。 |
flex-grow |
指定弹性项目将如何相对于弹性容器内的其他项目增长。 |
flex-shrink |
指定 flex 项相对于 flex 容器内的其他项如何收缩。 |
flex-wrap |
指定弹性项目是否应该换行。 |
float |
指定一个盒子是否应该浮动。 |
font |
在一个声明中定义多种字体属性。 |
font-family |
定义元素的字体列表。 |
font-size |
定义文本的字体大小。 |
font-size-adjust |
在发生字体回退时保持文本的可读性。 |
font-stretch |
从字体中选择正常、压缩或扩展的面。 |
font-style |
定义文本的字体样式。 |
font-variant |
指定字体变体。 |
font-weight |
指定文本的字体粗细。 |
height |
指定元素的高度。 |
justify-content |
指定在解决任何灵活长度和自动边距后,flex 项目如何沿 flex 容器的主轴对齐。 |
left |
指定定位元素左边缘的位置。 |
letter-spacing |
设置字母之间的额外间距。 |
line-height |
设置文本行之间的高度。 |
list-style |
定义列表和列表元素的显示样式。 |
list-style-image |
指定要用作列表项标记的图像。 |
list-style-position |
指定列表项标记的位置。 |
list-style-type |
指定列表项的标记样式。 |
margin |
设置元素所有四个边的边距。 |
margin-bottom |
设置元素的下边距。 |
margin-left |
设置元素的左边距。 |
margin-right |
设置元素的右边距。 |
margin-top |
设置元素的上边距。 |
max-height |
指定元素的最大高度。 |
max-width |
指定元素的最大宽度。 |
min-height |
指定元素的最小高度。 |
min-width |
指定元素的最小宽度。 |
opacity |
指定元素的透明度。 |
order |
指定弹性项目在弹性容器中的显示和布局顺序。 |
outline |
设置元素轮廓的所有四个边的宽度、样式和颜色。 |
outline-color |
设置轮廓的颜色。 |
outline-offset |
设置轮廓和元素边框边缘之间的空间。 |
outline-style |
设置轮廓样式。 |
outline-width |
设置轮廓的宽度。 |
overflow |
指定溢出元素框的内容的处理方式。 |
overflow-x |
指定对水平溢出元素框的内容的处理。 |
overflow-y |
指定对垂直溢出元素框的内容的处理。 |
padding |
在元素的所有四个边上设置填充。 |
padding-bottom |
将填充设置为元素的底部。 |
padding-left |
将填充设置到元素的左侧。 |
padding-right |
设置元素右侧的内边距。 |
padding-top |
将填充设置为元素的顶部。 |
page-break-after |
在元素后插入分页符。 |
page-break-before |
在元素前插入分页符。 |
page-break-inside |
在元素内插入分页符。 |
perspective |
定义查看对象所有子元素的视角。 |
perspective-origin |
定义透视属性的原点(3D 空间的消失点)。 |
position |
指定元素的定位方式。 |
quotes |
为嵌入的引用指定引号。 |
resize |
指定用户是否可以调整元素的大小。 |
right |
指定定位元素右边缘的位置。 |
tab-size |
指定制表符的长度。 |
table-layout |
指定表格布局算法。 |
text-align |
设置内联内容的水平对齐方式。 |
text-align-last |
指定当 text-align 为 justify 时块的最后一行或强制换行之前的一行如何对齐。 |
text-decoration |
指定添加到文本的装饰。 |
text-decoration-color |
指定 text-decoration-line 的颜色。 |
text-decoration-line |
指定向元素添加什么样的线条装饰。 |
text-decoration-style |
指定由 text-decoration-line 属性指定的线条样式 |
text-indent |
缩进第一行文本。 |
text-justify |
指定当 text-align 属性设置为 justify 时要使用的对齐方法。 |
text-overflow |
指定文本内容溢出块容器时如何显示。 |
text-shadow |
对元素的文本内容应用一个或多个阴影。 |
text-transform |
转换文本的大小写。 |
top |
指定定位元素上边缘的位置。 |
transform |
对元素应用 2D 或 3D 变换。 |
transform-origin |
定义元素的变换起点。 |
transform-style |
指定嵌套元素如何在 3D 空间中呈现。 |
transition |
定义元素的两种状态之间的转换。 |
transition-delay |
指定过渡效果何时开始。 |
transition-duration |
指定完成过渡效果所需的秒数或毫秒数。 |
transition-property |
指定应应用过渡效果的 CSS 属性的名称。 |
transition-timing-function |
指定过渡效果的速度曲线。 |
vertical-align |
设置元素相对于当前文本基线的垂直定位。 |
visibility |
指定元素是否可见。 |
white-space |
指定如何处理元素内的空白。 |
width |
指定元素的宽度。 |
word-break |
指定如何在单词中换行。 |
word-spacing |
设置单词之间的间距。 |
word-wrap |
指定内容溢出其容器边界时是否分词。 |
z-index |
指定定位元素的分层或堆叠顺序。 |
Advertisements