score:0

Accepted answer

you have to use .css to achieve what you are after, you can't do it with inline styles:

from https://medium.com/@jviereck/modularise-css-the-react-way-1e817b317b04#.gwcfeppld

css pseudo classes and media queries are not supported: using inline styles doesn’t give you the full expressiveness compared to writing normal css: in particular, there is no way to express css selectors for pseudo classes like .notification:hover or .notification:before. also, it is not possible to use media queries to adapt the styling based on view medium (e.g. adjust the content to look different when viewed on mobile vs. on desktop). libraries like radium offer a way to work around these limitations but have to do a nasty tricks to get there.

score:1

the example which you are referring on https://jsfiddle.net/rz2t224t/2 shows handling specific events on the html element.

return react.createelement(
 "button",
 {onmouseover: this.mouseover, onmouseout: this.mouseout},
 label
);

with above code when onmouseover and onmouseout event occur on the button then mouseover and mouseout function will be executed respectively.

we can use css with reactjs normally as we do.

for example of hover : https://jsfiddle.net/balaji_mitkari/69z2wepo/68520/


Related Query

More Query from same tag