根据设备更改 div 的宽度

Question

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

Answer 1

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

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

或

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

Answer 2

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