根据设备更改 div 的宽度

Question

我想使用 css 添加一个效果，使 div 的宽度为 500px，但前提是用户在计算机上。如果用户使用的是手机、平板电脑、iPad 等，它将具有预定义的宽度。我将如何做到这一点？

Answer 1

您正在寻找媒体查询，请阅读有关它的更多信息 here。如果你想知道不同的视图宽度，可以参考这个：-

1. 320px — 480px：移动设备
2. 481px — 768px：iPad、平板电脑
3. 769px — 1024px：小屏幕、笔记本电脑
4. 1025px — 1200px：桌面、大屏幕
5. 1201px 及以上 — 超大屏幕、电视

或

您可以使用响应式单元设置宽度，例如 100% 或 100vw，了解有关响应式单元 here 的更多信息。

Answer 2

如果您想检测设备，请检查此问题，但无论如何您都需要媒体查询。 What is the best way to detect a mobile device?