Css 像素在不同设备上的表现如何

如果这个问题看起来很愚蠢，请原谅，但我在这件事上确实是个初学者

假设我需要创建一个具有以下布局的网页

+----------------------------------------+
|             Img1 and overlay text      |
|                                        |
+--------------------+-------------------+
| img2 and           |   Img3 and        |
|    Overlay text    |   Overlay text    |
+--------------------+-------------------+

这个页面需要在手机、平板电脑和桌面上垂直或水平显示

可以这样说：Image1文本覆盖的高度应该是60px，以便在任何地方都能以相同的方式工作？ 或者我应该根据公共媒体断点定义不同的字体大小？ 此外，基于设备宽度的媒体查询是否足以为媒体查询覆盖的设备创建设计，或者在设计网站时是否需要考虑CSS像素比率

---

谢谢

我会选择em而不是px，除非你真的需要确切的尺寸。你能详细说明一下吗？如果我使用像素，我会遇到什么类型的问题？请阅读以下博文开始：。它还包含指向其他有用信息的链接。用一个简单的答案来说，恐怕有点太多了。是的，你需要再解释一下，通常你会使用像素，然后让不同的屏幕类型的高度可能会降低一点。如果yuo的身高是一个百分比，那么随着屏幕大小的变化，它会变得太大和太小。你们可以用20像素的xlg屏幕，17 lg，15 SM 10xs等等，谢谢大家。链接参考非常有趣。我只是调查了解指导方针，所以我现在没有更多的细节。