CSS3 過渡生成器
平滑的不透明度過渡
流行的預設
淡化效果
平滑的不透明度過渡
縮放效果
懸停時調整元素大小
旋轉效果
懸停時旋轉元素
滑動效果
移動元素位置
顏色變化
背景顏色過渡
關於過渡
CSS 過渡允許您在給定的持續時間內平滑地更改屬性值。
常見的動畫屬性包括：
- 寬度、高度
- 邊距， 填充
- 不透明度、顏色
- transform (scale, rotate, translate)
- background-color
專業提示：使用「所有屬性」選項為所有更改添加動畫效果。
Preview
HOVER ME
生成的代碼
.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; } .element:hover { /* Hover styles will be generated here */ }
過渡控件
300
0
懸停效果
100%
100%
0°
0px
0px
8px
8px