如何用CSS包装Reactjs组件

import React from 'react';

const MyComponent = () => {
  return (
    <div>
      <h1>Hello, World!</h1>
    </div>
  );
};

export default MyComponent;

.my-component {
  background-color: #f1f1f1;
  padding: 10px;
  border: 1px solid #ccc;
}

.my-component h1 {
  color: #333;
  font-size: 24px;
}

import React from 'react';
import './myComponent.css';

const MyComponent = () => {
  return (
    <div className="my-component">
      <h1>Hello, World!</h1>
    </div>
  );
};

export default MyComponent;

import React from 'react';
import MyComponent from './MyComponent';

const App = () => {
  return (
    <div>
      <h2>App Component</h2>
      <MyComponent />
    </div>
  );
};

export default App;