企业官网建设流程全解析

那个让我当场懵逼的面试题

记得曾经去面试，面试官突然问我：

“在移动端怎么画出1px高的线，还要在不同手机屏幕下都能保持一致的效果？”

我当时心里想：这不就是height: 1px吗？有什么难的？

于是我自信地回答：“用height: 1px和background-color就可以了。”

面试官笑了笑说：“那你试试在iPhone上看看，是不是真的1px？”

我当场就懵了…回来后我才发现，原来移动端画1px线有这么多门道！

今天就把我的分析、原理剖析、思考、总结分享给大家，希望对你们有帮助。

面试题分析：这道题到底在考什么？

这道题表面上是问怎么画1px线，实际上考察了好几个层面的知识。

第一层：基础知识层面

面试官首先想知道你有没有移动端开发的基础知识。

📌devicePixelRatio的理解

• 你知道什么是devicePixelRatio吗？
• 你知道为什么会导致1px变粗吗？
• 你知道不同设备的devicePixelRatio是多少吗？

如果你连devicePixelRatio都不知道，那说明你缺乏移动端开发的基础知识。

📌高DPI屏幕的适配

• 你知道什么是retina屏幕吗？
• 你知道高DPI屏幕和普通屏幕有什么区别吗？