为什么许多框架使用 1400-1600px 作为其 XXL 断点?

Why do many frameworks use 1400-1600px for their XXL breakpoint?

提问人:GeorgeCiesinski 提问时间:11/3/2023 更新时间:11/3/2023 访问量:42

问:

背景

如果这是一个不寻常的问题,我提前道歉。

我正在一个站点上工作,我必须配置一组断点。我努力弄清楚我应该用什么大小来制作断点,所以我大致基于 Bootstrap 的断点。此外,我做了一些挖掘,发现许多框架/项目都使用类似的断点,包括 Tailwind。

Bootstrap 5 的断点

$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
  xxl: 1400px
);

问题

所以我的问题是,为什么这么多项目使用大约 1400-1600px 的 XXL 断点大小,而现在大多数桌面显示器都要大得多?

提问目的

近 20 年来,大多数显示器都采用 1920px 格式,许多新显示器都是 2560px 或更大。我发现我的 1920px 显示器已经将 XXL 断点最大化,因此如果不创建更大的断点,我无法在更大的屏幕上更改样式。

澄清一下,我不是在寻找关于使用什么断点大小的“意见”。我见过许多使用类似大小的项目,所以我不得不相信他们可能知道自己在做什么,而我只是错误地使用了断点。

我的最终目标是确定我是否应该为 2k、4k 定义更大的断点,或者 1400-1600px 是否足以满足更大的屏幕,我只需要改变使用它们的方式。

CSS Bootstrap-5 断点

评论

0赞 j08691 11/3/2023
github.com/twbs/bootstrap/issues/14894
1赞 Dai 11/3/2023
有趣的事实:你不需要CSS断点。完全可以使用现代 CSS 功能(如 flex 和 grid,尤其是 grid 的重复自动列功能)来设计布局,这些功能可以优雅地重排,适用于小型手持式 UI 到大型桌面。
1赞 Dai 11/3/2023
我推测,但在高端使用 1600px 的一个可能原因是因为在足够宽的显示器(例如 1920px)上,用户倾向于停止全屏查看页面,而是使用多个重叠或平铺窗口进行多任务处理(并且通常是任何人都可以获得的最高分辨率(无需为显示器支付 2000+ 美元)回到 CRT 时代(2007 年,我短暂地拥有一对 22 英寸 LaCie Electron Blue IV CRT(从eBay,我买不起新的!从表面上看,他们可以做到 1920x1440 像素,但模拟信号真的不能很好地工作。1600x1200px
0赞 deceze 11/3/2023
哪个精神病患者在 2500+ px 宽的窗口中查看网站?无论如何,大多数网站大多是这个大小的空白。更好地利用您的可用空间,即使只是查看您的壁纸而不是网站的空白。
0赞 Dai 11/3/2023
@deceze我要说的是,在巨大的显示器上全屏打开一个窗口(比如我目前的 4K 43 英寸戴尔(96dpi!))来查看电子表格、仪表板和各种形式的海量数据(包括通过网络浏览器访问这些数据时)——但是,是的,“普通”网站通常无法使用,因为不假思索的网页设计师假设每个人都使用纵向移动浏览器*唉*

答: 暂无答案