How to apply inline styling to a React component

Question

Can i know How to apply inline styling to a React component?

Answer 1

You apply inline styling in React using the style attribute with a JavaScript object.

Example:

function MyComponent() {

  return (

    <div style={{ backgroundColor: 'lightblue', padding: '10px', borderRadius: '8px' }}>

      Inline Styled Component

    </div>

  );

}