顺风 + Javascript

Question

tailwind 是否与 javascript 代码兼容，因为我每次使用它都不起作用。

示例代码：

<div class="slides"
     data-0="transform translate-x-0 translate-y-0"
     data-100p="transform translate-x-0 translate-y-1/2"
     data-200p="transform translate-x-1/2 translate-y-1/2"
     data-300ps="transform translate-x-1/2
> 
...
</div>

skrollr.js

 <script src="/home/isswarya/skrollr.min.js"></script>
 <script type="text/javascript">var s = skrollr.init();
 </script>

Answer 1

是的 Tailwind CSS 与 javascript 代码兼容。默认情况下，Tailwind 将在项目的根目录中查找可选的 tailwind.config.js 文件，您可以在其中定义任何自定义项。

// Example `tailwind.config.js` file

module.exports = {
  important: true,
  theme: {
    fontFamily: {
      display: ['Gilroy', 'sans-serif'],
      body: ['Graphik', 'sans-serif'],
    },
    extend: {
      colors: {
        cyan: '#9cdbff',
      },
      margin: {
        '96': '24rem',
        '128': '32rem',
      },
    }
  },
  variants: {
    opacity: ['responsive', 'hover']
  }
}

可以看到Tailwind CSS Configuration

顺风 + Javascript

Tailwind + Javascript

skrollr

tailwind-css