使用bootstrap react将3个项目相邻对齐

import React from 'react';
import 'bootstrap/dist/css/bootstrap.min.css';

const Project1 = () => {
  return (
    <div className="project">
      <h3>Project 1</h3>
      <p>This is the content of Project 1.</p>
    </div>
  );
};

const Project2 = () => {
  return (
    <div className="project">
      <h3>Project 2</h3>
      <p>This is the content of Project 2.</p>
    </div>
  );
};

const Project3 = () => {
  return (
    <div className="project">
      <h3>Project 3</h3>
      <p>This is the content of Project 3.</p>
    </div>
  );
};

const App = () => {
  return (
    <div className="container">
      <div className="row">
        <div className="col">
          <Project1 />
        </div>
        <div className="col">
          <Project2 />
        </div>
        <div className="col">
          <Project3 />
        </div>
      </div>
    </div>
  );
};

export default App;