TailWindCSS 最大高度

TailWindCSS Max Height

所以我想知道如何在 TailWindCSS Config 中设置最大高度媒体断点。 IPad Pro 因其宽度而被识别为笔记本电脑。 也就是说,它们对于笔记本电脑来说太高了 CSS,让我的网站看起来很糟糕。

欢迎任何帮助, 谢谢, 贾斯汀

我翻阅了 Tailwind 文档,Max Height 媒体查询似乎有 none。

但您可以创建自己的 Custom media queries。我不知道 iPad Pro 的身高。但是我根据文档做了一个例子。 (也是未经测试的例子)

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      screens: {
        'iPad': {'raw': '(max-height: 1234px)'},
        // => @media (max-height: 1234px) { ... }
      }
    }
  }
}

编辑: 我不确定这会是什么输出,我猜 iPad:text-xl 或其他。

你可以直接将它应用到 jsx 元素内联。例如

 <div className='max-h-[1234px]'></div>