如何使用 Tailwind 将媒体查询应用于高度和宽度？

【问题标题】：How can I apply a media query to height and width using Tailwind?如何使用 Tailwind 将媒体查询应用于高度和宽度？
【发布时间】：2020-09-06 22:33:57
【问题描述】：

我想用 Tailwind 做这样的事情，

@/media screen and (max-width: 995px) , screen and (max-height: 700px) { ... }

有可能吗？

【问题讨论】：

标签： css tailwind-css

【解决方案1】：

解决方法：

screens: {
    'custombp': {'raw': '(max-height: 1234px),(min-width:920px)'}
}

_{代表提问者添加。}

【讨论】：

【解决方案2】：

在您的 tailwind 配置 .js 文件中，您可以添加类似这样的内容。关注breakpoints链接，还有其他例子可以学习。

module.exports = {
  theme: {
    screens: {
      'sm': '640px',
      // => @media (min-width: 640px) { ... }

      'md': '768px',
      // => @media (min-width: 768px) { ... }

      'lg': '1024px',
      // => @media (min-width: 1024px) { ... }

      'xl': '1280px',
      // => @media (min-width: 1280px) { ... }
    }
  }
}

【讨论】：