按钮特效按照交互场景来分,应该有hover场景,和click点击场景。
特效是为了给予用户正确的反馈,提升交互体验。通过色彩、大小、位置的变化实现。
特效,一般通过 ①改变背景色确认操作、②改变文本颜色,形成视觉色差变化,使用户感受到明亮等;③改变按钮尺寸、文本字体大小形成视觉冲击;④ 增加阴影,发光效果;⑤抖动、旋转等动画特性;
hover特效:
1.改变透明度
.btn { &:hover { opacity: 0.8; } }
2.改变文本颜色
2024-02-06 14:16:28
按钮特效按照交互场景来分,应该有hover场景,和click点击场景。
特效是为了给予用户正确的反馈,提升交互体验。通过色彩、大小、位置的变化实现。
特效,一般通过 ①改变背景色确认操作、②改变文本颜色,形成视觉色差变化,使用户感受到明亮等;③改变按钮尺寸、文本字体大小形成视觉冲击;④ 增加阴影,发光效果;⑤抖动、旋转等动画特性;
hover特效:
1.改变透明度
.btn { &:hover { opacity: 0.8; } }
2.改变文本颜色