那个让我当场懵逼的面试题
记得曾经去面试,面试官突然问我:
“在移动端怎么画出1px高的线,还要在不同手机屏幕下都能保持一致的效果?”
我当时心里想:这不就是height: 1px吗?有什么难的?
于是我自信地回答:“用height: 1px和background-color就可以了。”
面试官笑了笑说:“那你试试在iPhone上看看,是不是真的1px?”
我当场就懵了…回来后我才发现,原来移动端画1px线有这么多门道!
今天就把我的分析、原理剖析、思考、总结分享给大家,希望对你们有帮助。
面试题分析:这道题到底在考什么?
这道题表面上是问怎么画1px线,实际上考察了好几个层面的知识。
第一层:基础知识层面
面试官首先想知道你有没有移动端开发的基础知识。
📌devicePixelRatio的理解
- 你知道什么是devicePixelRatio吗?
- 你知道为什么会导致1px变粗吗?
- 你知道不同设备的devicePixelRatio是多少吗?
如果你连devicePixelRatio都不知道,那说明你缺乏移动端开发的基础知识。
📌高DPI屏幕的适配
- 你知道什么是retina屏幕吗?
- 你知道高DPI屏幕和普通屏幕有什么区别吗?