CSS animated properties
一些 CSS 属性可以是动画的,也就是说,当它的值改变时,或者当 CSS 动画或 CSS 转换使用时,它可以以平滑的方式改变。
可动画属性的列表是:
-moz-outline-radius
-moz-outline-radius-bottomleft
-moz-outline-radius-bottomright
-moz-outline-radius-topleft
-moz-outline-radius-topright
-ms-grid-columns
(en-US)-ms-grid-rows
(en-US)-webkit-line-clamp
-webkit-text-fill-color
(en-US)-webkit-text-stroke
-webkit-text-stroke-color
(en-US)accent-color
(en-US)all
backdrop-filter
background
background-color
background-position
background-size
block-size
border
border-block-end
border-block-end-color
(en-US)border-block-end-width
(en-US)border-block-start
(en-US)border-block-start-color
(en-US)border-block-start-width
(en-US)border-bottom
border-bottom-color
border-bottom-left-radius
border-bottom-right-radius
border-bottom-width
border-color
border-end-end-radius
(en-US)border-end-start-radius
(en-US)border-image-outset
border-image-slice
border-image-width
border-inline-end
(en-US)border-inline-end-color
(en-US)border-inline-end-width
(en-US)border-inline-start
(en-US)border-inline-start-color
(en-US)border-inline-start-width
(en-US)border-left
border-left-color
border-left-width
border-radius
border-right
border-right-color
border-right-width
border-start-end-radius
(en-US)border-start-start-radius
(en-US)border-top
border-top-color
border-top-left-radius
border-top-right-radius
border-top-width
border-width
bottom
box-shadow
caret
caret-color
caret-shape
clip
clip-path
color
column-count
column-gap
column-rule
column-rule-color
column-rule-width
column-width
(en-US)columns
contain-intrinsic-block-size
(en-US)contain-intrinsic-height
(en-US)contain-intrinsic-inline-size
(en-US)contain-intrinsic-size
(en-US)contain-intrinsic-width
(en-US)filter
flex
flex-basis
flex-grow
flex-shrink
font
font-size
font-size-adjust
font-stretch
font-variation-settings
font-weight
gap
grid-column-gap
(en-US)grid-gap
(en-US)grid-row-gap
(en-US)grid-template-columns
grid-template-rows
height
inline-size
input-security
inset
(en-US)inset-block
(en-US)inset-block-end
(en-US)inset-block-start
(en-US)inset-inline
(en-US)inset-inline-end
(en-US)inset-inline-start
(en-US)left
letter-spacing
line-clamp
line-height
margin
margin-block
margin-block-end
(en-US)margin-block-start
margin-bottom
margin-inline
(en-US)margin-inline-end
(en-US)margin-inline-start
(en-US)margin-left
margin-right
margin-top
mask
mask-border
mask-position
(en-US)mask-size
(en-US)max-block-size
(en-US)max-height
max-inline-size
(en-US)max-lines
max-width
min-block-size
(en-US)min-height
min-inline-size
(en-US)min-width
object-position
offset
offset-anchor
(en-US)offset-distance
(en-US)offset-path
(en-US)offset-position
(en-US)offset-rotate
(en-US)opacity
order
outline
outline-color
outline-offset
outline-width
padding
padding-block
(en-US)padding-block-end
(en-US)padding-block-start
(en-US)padding-bottom
padding-inline
(en-US)padding-inline-end
(en-US)padding-inline-start
padding-left
padding-right
padding-top
perspective
perspective-origin
right
rotate
row-gap
scale
scroll-margin
scroll-margin-block
(en-US)scroll-margin-block-end
(en-US)scroll-margin-block-start
(en-US)scroll-margin-bottom
(en-US)scroll-margin-inline
(en-US)scroll-margin-inline-end
(en-US)scroll-margin-inline-start
(en-US)scroll-margin-left
(en-US)scroll-margin-right
(en-US)scroll-margin-top
scroll-padding
(en-US)scroll-padding-block
(en-US)scroll-padding-block-end
(en-US)scroll-padding-block-start
(en-US)scroll-padding-bottom
(en-US)scroll-padding-inline
(en-US)scroll-padding-inline-end
(en-US)scroll-padding-inline-start
(en-US)scroll-padding-left
(en-US)scroll-padding-right
(en-US)scroll-padding-top
(en-US)scroll-snap-coordinate
scroll-snap-destination
scroll-timeline
(en-US)scrollbar-color
shape-image-threshold
shape-margin
shape-outside
tab-size
text-decoration
text-decoration-color
text-decoration-thickness
text-emphasis
(en-US)text-emphasis-color
(en-US)text-indent
text-shadow
text-underline-offset
top
transform
transform-origin
translate
vertical-align
visibility
width
word-spacing
z-index
zoom
(en-US)