小编Aku*_*sas的帖子

Tailwind CSS:伪类之前

我现在一直在兜圈子,试图了解正在发生的事情。我正在使用 Tailwind 的故事书制作一个设计库。我似乎无法让 :before 伪类工作。无论我将它放置在样式中的哪个位置,它都永远不会被渲染。

一个例子是我正在尝试制作一个使用react-slick的组件,并且想要设置导航的样式:

'& .slick-dots': {
  bottom: -30,
  display: 'block',
  left: 4,
  listStyle: 'none',
  margin: 0,
  padding: 0,
  position: 'absolute',
  textAlign: 'center',
  width: '100%',

  '& li': {
    cursor: 'pointer',
    display: 'inline-block',
    height: 20,
    margin: '0 5px',
    padding: 0,
    position: 'relative',
    width: 20,

     '& button': {
       border: 0,
       background: 'transparent',
       display: 'block',
       height: 20,
       width: 20,
       outline: 'none',
       lineHeight: 0,
       fontSize: 0,
       color: 'transparent',
       padding: 5,
       cursor: 'pointer',

       '&:before': {
        position: 'absolute',
        top: 0,
        left: 0,
        content: '', …
Run Code Online (Sandbox Code Playgroud)

emotion reactjs storybook tailwind-css css-in-js

4
推荐指数
1
解决办法
2万
查看次数

标签 统计

css-in-js ×1

emotion ×1

reactjs ×1

storybook ×1

tailwind-css ×1