超级会员免费看
本文介绍了前端面试中关于CSS的重要知识点，包括requestAnimationFrame的理解，盒模型的差异，以及图片格式的应用场景。文章详细讲解了requestAnimationFrame的优缺点，如何使用以及与setTimeout的区别，还探讨了为何有时使用translate而非position改变位置的原因。此外，还讨论了li之间的空白间隔问题以及常见图片格式（如BMP、GIF、JPEG、PNG、SVG、WebP和AVIF）及其适用场景。最后，阐述了物理像素、逻辑像素和像素密度的概念，以及在移动端为何需要@3x、@2x等适配图片。
1. 对 requestAnimationframe 的理解
考点
- js 动画实现方式；
SetTimeout\SetInterval与requestAnimationframe的区别和优缺点；requestAnimationframe的使用，包括对回调函数的理解；
答案
实现动画效果的方法比较多，Javascript 中可以通过定时器 setTimeout\SetInterval 来实现，CSS3 中可以使用 transition 和 animation 来实现，HTML5 中的 canvas 也可以实现。除此之外，HTML5 提供一个专门用于请求动画的 API 也可以实现，即 requestAnimationFrame，顾名思义就是请求动画帧。
语法： window.requestAnimationFrame(callback);
其中，callback 是下一次重绘之前更新动画帧所调用
订阅专栏 解锁全文
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
