例如,此媒体查询:
@supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))) { @apply bg-black; }
需要写为(如@screen):
@screen
@support blur5 { @apply bg-black; }
怎么做?
qij5mzcb1#
您可以编辑tailwind.config.js文件以添加自定义介质查询。以下是一些自定义介质查询示例:
theme: { extend: { screens: { '2xl': '1440px', '3xl': '1536px', 'custom-height-mq': { 'raw': '((min-width: 1024px) and (max-height: 830px))' }, } }, },
如果你需要更多帮助,请告诉我。
pwuypxnk2#
将类 Package 在@responsive {}指令中,将生成您使用配置中定义的断点编写的类,例如默认情况下为sm、md、lg和xl
@responsive {}
@responsive { .my-class {} }
使用默认断点,它将生成sm:my-classmd:my-class``lg:my-classxl:my-class。
sm:my-class
md:my-class``lg:my-class
xl:my-class
2条答案
按热度按时间qij5mzcb1#
您可以编辑tailwind.config.js文件以添加自定义介质查询。以下是一些自定义介质查询示例:
如果你需要更多帮助,请告诉我。
pwuypxnk2#
将类 Package 在
@responsive {}
指令中,将生成您使用配置中定义的断点编写的类,例如默认情况下为sm、md、lg和xl使用默认断点,它将生成
sm:my-class
md:my-class``lg:my-class
xl:my-class
。