I've imported a few different components in my React project, and most of them have .css files with preset style settings. For the most part, I've been manually changing the CSS files to suit my needs. Is there a way to change the CSS directly from React? That is, is there similar to jquery where i can find the corresponding classes and change the attributes?
-
You can only do inline-styling from a React component, apart from setting classes and ids.Henrik Andersson– Henrik Andersson2016-01-25 22:02:10 +00:00Commented Jan 25, 2016 at 22:02
-
I would update the stylesheet. Otherwise it will probably become a mess because now there are two places were you are modifying styles.Wim Mostmans– Wim Mostmans2016-05-03 06:31:13 +00:00Commented May 3, 2016 at 6:31
Add a comment
|
1 Answer
For small changes here and there you can use React Inline Styles.
If you want to modify more things, you can create css/less/scss files that are local to your components and override the styles of imported components there. Here's a good example. Make sure to check the webpack configs that make that work.
3 Comments
Raydot
Avoid inline styles like the plague. Seems like a good idea at the time but down the road becomes very difficult to maintain.
Dmitry Shvedov
Generally yes, but if you have a style that will only apply to this one element, and there's no way to generalize it, than why not? Definitely something not to be abused though.
Raydot
True. Avoid inline styles like a mild flu.