CSS3 渐变和阴影怎样用得更像界面而不是特效
· 阅读需 2 分钟
CSS3 刚流行起来的时候,渐变和阴影往往是最能让人立刻看见变化的两个能力。按钮不再只有一块平色,弹层也终于能更自然地从页面里“浮”出来。但真正要写得顺眼,关键不是效果多,而是分寸感。
CSS3 刚流行起来的时候,渐变和阴影往往是最能让人立刻看见变化的两个能力。按钮不再只有一块平色,弹层也终于能更自然地从页面里“浮”出来。但真正要写得顺眼,关键不是效果多,而是分寸感。
2013 年做前端时,大家会明显感受到一个变化:原来很多必须靠 JavaScript 才能做的动效,开始慢慢可以交给 CSS3 了。
CSS3 动画刚流行起来的时候,很多前端最直观的感受就是“终于能做出以前很费劲的效果了”。我当时也一样,看到元素能平滑移动、淡入淡出、缩放旋转,很容易就想把这些能力都塞进页面里。但真正做了几轮页面后,我慢慢发现,动画如果先追求炫,最后往往会伤体验。
在 CSS3 逐渐进入日常开发之后,很多前端会先接触到 transition,然后很快就会继续碰到 transform。它真正让人眼前一亮的地方,是页面元素终于不只是“换颜色”,还可以更自然地移动、缩放和旋转。