魔鬼信天翁

Avatar of Chris Coyier
Chris Coyier

DigitalOcean 为您的旅程的每个阶段提供云产品。 立即开始使用 $200 免费积分!

Nils Binder 谈论 一种用于两个元素之间间距的技术。 想象一下大屏幕上的标题,在左上角有徽标,在右上角有导航栏。 然后是小屏幕,当它们不能再在同一个“行”上并且需要换行时,它们不会只是换行,而是被_居中_。

视频解释得更好

我的想法是:我会找到我想让这种情况发生的断点的精确像素值,然后编写一个媒体查询来重新设置样式以做到这一点。

但是……媒体查询仅适用于整个浏览器窗口宽度。 虽然这可能在这种情况中有效,因为它是一个全站级别的关注点,但我理解不想编写媒体查询的愿望。 Nils 的想法借鉴了 Heydon 的 神圣信天翁 的概念,以实现完全不使用媒体查询。 因此,您可以在更小的范围组件上使用它,您需要在与浏览器窗口大小无关的特定大小处调整断点。

直接链接 →