CSS3 总结-2

时间:2021-03-15 16:23:42

过渡属性

下面的表格列出了所有的转换属性:

属性 描述 CSS
transition 简写属性,用于在一个属性中设置四个过渡属性。 3
transition-property 规定应用过渡的 CSS 属性的名称。 3
transition-duration 定义过渡效果花费的时间。默认是 0。 3
transition-timing-function 规定过渡效果的时间曲线。默认是 "ease"。 3
transition-delay 规定过渡效果何时开始。默认是 0。 3

CSS3 动画属性

下面的表格列出了 @keyframes 规则和所有动画属性:

属性 描述 CSS
@keyframes 规定动画。 3
animation 所有动画属性的简写属性,除了 animation-play-state 属性。 3
animation-name 规定 @keyframes 动画的名称。 3
animation-duration 规定动画完成一个周期所花费的秒或毫秒。默认是 0。 3
animation-timing-function 规定动画的速度曲线。默认是 "ease"。 3
animation-delay 规定动画何时开始。默认是 0。 3
animation-iteration-count 规定动画被播放的次数。默认是 1。 3
animation-direction 规定动画是否在下一周期逆向地播放。默认是 "normal"。 3
animation-play-state 规定动画是否正在运行或暂停。默认是 "running"。 3
animation-fill-mode 规定对象动画时间之外的状态。 3

新的多列属性

下面的表格列出了所有的转换属性:

属性 描述 CSS
column-count 规定元素应该被分隔的列数。 3
column-fill 规定如何填充列。 3
column-gap 规定列之间的间隔。 3
column-rule 设置所有 column-rule-* 属性的简写属性。 3
column-rule-color 规定列之间规则的颜色。 3
column-rule-style 规定列之间规则的样式。 3
column-rule-width 规定列之间规则的宽度。 3
column-span 规定元素应该横跨的列数。 3
column-width 规定列的宽度。 3
columns 规定设置 column-width 和 column-count 的简写属性。 3

新的用户界面属性

下面的表格列出了所有的转换属性:

属性 描述 CSS
appearance 允许您将元素设置为标准用户界面元素的外观 3
box-sizing 允许您以确切的方式定义适应某个区域的具体内容。 3
icon 为创作者提供使用图标化等价物来设置元素样式的能力。 3
nav-down 规定在使用 arrow-down 导航键时向何处导航。 3
nav-index 设置元素的 tab 键控制次序。 3
nav-left 规定在使用 arrow-left 导航键时向何处导航。 3
nav-right 规定在使用 arrow-right 导航键时向何处导航。 3
nav-up 规定在使用 arrow-up 导航键时向何处导航。 3
outline-offset 对轮廓进行偏移,并在超出边框边缘的位置绘制轮廓。 3
resize 规定是否可由用户对元素的尺寸进行调整。 3