此页面需要javascript支持,请在浏览器中启用javascript

TailwindCSS(3)-函数与指令

css
阅读 

Functions & Directives

link

@tailwind

Use the @tailwind directive to insert Tailwind's base, components, utilities and screens styles into your CSS.

@apply

自定义css提取,在scss里可以定义自己的class使用tailwind的class Use @apply to inline any existing utility classes into your own custom CSS.

@variants

You can generate responsive, hover, focus, active, and other variants of your own utilities by wrapping their definitions in the @variants directive

@responsive

把自定义的样式和tailwind定义的响应式样式相结合的功能

You can generate responsive variants of your own classes by wrapping their definitions in the @responsive directive:

@screen

方便的响应式语法糖

@media (min-width: 640px) = @screen sm

theme()

用tailwind里的东西放进自定义css

stylelint

stylelint报错,配置

rules:{
  'at-rule-no-unknown': [
      true,
      {
        ignoreAtRules:['responsive', 'variants', 'tailwind', 'apply', 'screen']
      },
    ]
}

© 2021 icebreaker 苏ICP备19002675号-2
version:1.2.2