How would you write an inline style in React?

To write an inline style in React, you would create a JavaScript object containing CSS properties and their corresponding values, and then assign this object to the style attribute of a JSX element. In React, the CSS properties within the style object must be written in camelCase syntax, as opposed to the kebab-case used in traditional CSS.

Here's an example of how you might write an inline style in React:

const divStyle = {
  color: 'blue',
  backgroundColor: 'lightgray',
  padding: '10px',
  borderRadius: '5px'
};

function MyStyledComponent() {
  return <div style={divStyle}>Stylish Div</div>;
}

In this example, divStyle is a JavaScript object where each key-value pair represents a CSS property and its value. The style attribute of the div JSX element is then set to divStyle, applying the styles directly to that element[2][4][6].

It's important to note that while inline styles are convenient...