CSS面试题反馈
由 Mux 赞助的 DEV 全球展示挑战赛:展示你的项目!
过去两周,我们一直在面试前端职位候选人,其中——除其他事项外——我负责询问有关样式和 CSS 的问题。
于是,我写了一个略带讽刺意味的 CSS 笑话片段,文字“CSS 太棒了”溢出了一个框:
其理念是提出一些可以在几分钟内(不超过 15 分钟)回答的开放式问题,这些问题可以有不同的答案,从而引发对话并了解候选人的思考过程。
部分问题包括:
- 如何避免文本溢出?
- 如何将方框居中显示在屏幕上?
- 能否为每行文字设置不同的颜色?
- 它有什么
box-sizing: border-box作用? - 你知道这个
vmin单位代表什么吗?
例如,如果候选人通过加宽框或改变字体大小来避免文本溢出,我可以添加限制条件,即宽度和字体必须固定,因此必须找到替代方案。
或者对于关于如何将盒子居中显示在屏幕上的问题——这是 StackOverflow 上最热门的 CSS 问题之一——如果他们使用了定位,我可以要求使用 FlexBox 或类似方法的解决方案。
他们可以修改 HTML 和 CSS,但不能添加 JavaScript。再次强调,重点在于观察他们的思考方式,而不是解决方案本身(每个问题都有很多种解决方法)。
通过本次测试,我尝试涵盖一些主要的 CSS 功能:定位、FlexBox/Grid、变换、盒模型、文本属性和一些单位。
这是我第一次真正设计出这样的练习(以前我只是问一些通用问题),从那以后,我决定转向一些更“实用”的东西:开发一个小组件并为其添加样式,这虽然不是 CSS 特有的,但它可以测试多种学科。
问题是我不知道我最初的测试应该被认为有多复杂……所以我才来找你(提前感谢你的帮助)。
如果您有以上疑问:
- 你觉得这太简单还是太复杂?
- 它是否缺少一些重要功能?(例如,伪元素的空间不够)
- 为了改进它,你会添加/删除什么?