how to assign value in style attribute in html tags in reactjs

Question

This work in simple html css but how to use style and give --i value in react

<span style="--i:3;" className="this">
          p
        </span>

CSS this is how i used this --i in css

 span {
      animation: animate 1s ease-in-out infinite;
      animation-delay: calc(0.1s * var(--i));
    }
    @keyframes animate {
      0% {
        transform: translateY(0px);
      }
      20% {
        transform: translateY(-20px);
      }
      40%,
      100% {
        transform: translateY(0px);
      }
    }

Does this answer your question? Adding style attribute in react — Heretic Monkey
– Heretic Monkey, Commented Oct 17, 2022 at 15:22

Asmoth · Accepted Answer · 2022-10-17 15:19:55Z

0

In react, for your HTML, use this syntax :

<span style={{ '--i': 3 }} className="this">
     p
</span>

answered Oct 17, 2022 at 15:19

Asmoth

5633 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Bipin Bhandari Over a year ago

I visited late but thanks :)

Collectives™ on Stack Overflow

how to assign value in style attribute in html tags in reactjs

1 Answer 1

1 Comment

Your Answer

Linked

Collectives™ on Stack Overflow

how to assign value in style attribute in html tags in reactjs

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related