CODEWITHSUNDEEP
javascriptcssreactjs
user6839561
user6839561

Reputation:

How can I use a .css stylesheet in React?

So I have a very large stylesheet and I'm attempting to use it in my React code. I know typically you would use this format for styling in React:

transparentBg: {
    background: 'transparent'
},

WhiteText: {
    color:'white'
},

However, my css stylesheet looks like this:

.transparentBg{
    background: transparent;
}

.WhiteText{
    color:white;
}

Is there anyway to convert my entire CSS stylesheet into that React-style format? Or a way for me to just use the original CSS stylesheet without converting it?

Upvotes: 1

Views: 135

Answers (1)

Misha Reyzlin
Misha Reyzlin

Reputation: 13896

Your CSS is still just CSS and React still just renders HTML elements on the page.

This means that you can add your large CSS file into html file and just add CSS classes / ids etc. that you define there to the elements in React.

So if you have 

.transparentBg{
    background: transparent;
}

.WhiteText{
    color:white;
}

Then in your React components you can use these classes:

var SomeComponent = function () {
  return <div className="WhiteText">
    Foo Bar Baz
  </div>;
};

Upvotes: 3

Related Questions