在此页面上,我们可以找到所有带有参考和简短描述的 CSS3 属性组。
CSS3 属性列表
动画属性
| 属性 | 描述 |
|---|---|
| animation | 动画(逐渐从一种样式变为另一个样式)CSS属性,具有离散值。 |
| animation-delay | 指定动画将何时开始。 |
| animation-direction | 设置动画的播放方式:向前,向后或者备用周期。 |
| animation-duration | 定义动画所需的时间(以秒或者秒或者毫秒为单位),以完成一个动画循环。 |
| animation-fill-mode | 当动画未执行时将样式设置为元素(在它开始之前,它在结束后或者两者之后)。 |
| animation-iteration-count | 定义动画应播放的次数。 |
| animation-name | 定义要应用的@keyframs规则的名称。它有两个值:无和keyframename。 |
| animation-play-state | 指定动画是否正在运行或者暂停。 |
| animation-timing-function | 定义动画如何在每个周期的持续时间内进行,而不是整个动画。 |
| @keyframes | @keyframs at-trum是用于动画的关键帧动画的基础(逐渐从一种样式变为另一个样式)许多CSS属性。 |
背景属性
| 属性 | 描述 |
|---|---|
| background-clip | 指定背景颜色和背景 - 图像应该来自元素的距离。 |
| background-oroirn | 指定背景图像的后台定位区域。 |
| background-size | 定义背景图像的大小。 |
边框属性
| 属性 | 描述 |
|---|---|
| border-bottom-left-radius | 定义元素左下角的圆形形状。 |
| border-bottom-right-radius | 设置元素右下角的舍入。 |
| border-image | 允许将图像指定为元素周围的边框。 |
| border-image-outset | 指定边框图像延伸到元素边框框之外的数量。 |
| border-image-repeat | 指定边框图像是否将舍入,重复或者拉伸。 |
| border-image-slice | 指定如何将边界图像源指定的图像切片为九个区域:四个角落,四个边缘,中间部分。 |
| border-image-source | 设置用于创建元素的边框图像的源图像。 |
| border-image-width | 定义边框图像的宽度。 |
| border-radius | 为元素的外边界边缘制作圆角。 |
| border-top-left-radius | 定义元素左上角的圆角。有三种圆形。 |
| border-top-right-radius | 定义元素右上角的圆形形状。有三种圆形。 |
颜色属性
| 属性 | 描述 |
|---|---|
| opacity | 指定元素的透明度。 |
灵活的盒子布局
| 属性 | 描述 |
|---|---|
| align-content | 当有可用空间垂直(在横轴上)时,对齐Flex容器的线。 |
| align-items | 定义Flex项目(item)(item)的默认对齐。它与justify-content属性相同,但垂直版本。 |
| flex | 指定灵活长度的组件。 |
| flex-basis | 定义灵活项目(item)(item)的初始主大小。 |
| flex-direction | 定义Flex容器的主轴,并设置出现Flex项目(item)(item)的顺序。 |
| flex-flow | Flex-Wrap和Flex方向属性的速写属性。 |
| flex-grow | 指定项目(item)(item)相对于Flex容器的其余项目(item)(item)的成长量。 |
| flex-shrink | 指定该项目(item)(item)相对于Flex容器的其余项目(item)(item)缩小的数量。 |
| flex-wrap | 指定灵活项是否应包装。 |
| justify-content | 当项目(item)(item)不水平使用所有可用空间时对齐项目(item)(item)。 |
| order | 指定Flex或者网格容器内部灵活项目(item)(item)的顺序。 |
字体属性
| 属性 | 描述 |
|---|---|
| font-size-adjust | 当第一个选定的字体不可用时,控制字体大小。 |
| font-stretch | 使文本较窄或者更广泛。 |
多列布局属性
| 属性 | 描述 |
|---|---|
| column-count | 指定划分元素内容的列数。 |
| column-fill | 在分为列时控制元素的内容。 |
| column-gap | 设置列之间的间隙的长度。 |
| column-rule | 定义列之间规则的样式,宽度和颜色。 |
| column-rule-color | 设置规则的颜色。 |
| column-rule-style | 定义列之间的规则的样式。 |
| column-rule-width | 定义列之间规则的宽度。 |
| column-span | 指定元素是否跨越一列或者所有列。 |
| column-width | 定义列的宽度。 |
| columns | 列计数和列宽的速记属性。 |
轮廓属性
| 属性 | 描述 |
|---|---|
| outline-offset | 指定概要和元素的边界边缘之间的空间。 |
文本属性
| 属性 | 描述 |
|---|---|
| tab-size | 设置标签字符的宽度。 |
| text-align-last | 设置文本最后一行的对齐。 |
| text-decoration-color | 设置文本装饰的颜色。 |
| text-decoration-line | 指定将用于文本装饰的行。 |
| text-decoration-style | 指定文本装饰的样式。 |
| text-justify | 定义单词或者字符之间间距的行为。 |
| text-overflow | 指定如何向用户发出溢出的内联文本。 |
| text-shadow | 允许向文本添加阴影。 |
| column-width | 定义列的宽度。 |
| word-break | 指定行应损坏的位置。 |
| word-wrap | 允许将线条分成单词,以便适合其容器。 |
变换属性
| 属性 | 描述 |
|---|---|
| backface-visibility | 指定元素的背面是否应可见。 |
| perspective | 提供3D定位元素一些透视并确定Z = 0平面之间的距离。 |
| perspective-oroirn | 定义用户正在查看3D定位元素的位置。 |
| transform | 指定元素的二维或者三维变换。 |
| transform-oroirn | 允许更改元素变换的位置。 |
| transform-style | 指定儿童元素如何在三维(3D)空间中呈现。 |
过渡属性
| 属性 | 描述 |
|---|---|
| transition | 以下属性的速记属性:转换 - 属性,转换持续时间,转换定时功能,转换延迟 |
| transition-delay | 指定转换效果应开始。 |
| transition-duration | 指定过渡动画应该需要多长时间。 |
| transition-property | 指定转换的属性的名称。 |
| transition-timing-function | 指定在其持续时间内进行的转换,允许更改速度。 |
视觉格式属性
| 属性 | 描述 |
|---|---|
| overflow-x | 指定在内容溢出元素的左边缘时是否应隐藏,可见或者滚动内容。 |
| overflow-y | 指定当内容溢出元素的顶部和底部边缘时是否应隐藏,可见或者垂直滚动内容。 |
| resize | 指定元素如何可调整大小。 |
| box-shadow | 允许在框周围实现多个阴影,指定颜色,大小,模糊,偏移和插图的值。 |
| box-sizing | 如果包括填充和边界,则定义元素的宽度和高度的计算。 |
日期:2020-06-02 22:14:27 来源:oir作者:oir
