如何设计React类组件的样式？

class MyComponent extends React.Component {
  render() {
    const styles = {
      color: 'red',
      fontSize: '16px',
      fontWeight: 'bold',
    };
    
    return (
      <div style={styles}>
        This is my component.
      </div>
    );
  }
}

import styles from './MyComponent.module.css';

class MyComponent extends React.Component {
  render() {
    return (
      <div className={styles.container}>
        This is my component.
      </div>
    );
  }
}

import styled from 'styled-components';

const Container = styled.div`
  color: red;
  font-size: 16px;
  font-weight: bold;
`;

class MyComponent extends React.Component {
  render() {
    return (
      <Container>
        This is my component.
      </Container>
    );
  }
}