如何使用bootstrap 4.4将旋转木马的大小强制为4:3？

<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.4.0/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/3.4.1/jquery.min.js"></script>

<div id="myCarousel" class="carousel slide" data-ride="carousel">
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img src="image1.jpg" alt="Image 1">
    </div>
    <div class="carousel-item">
      <img src="image2.jpg" alt="Image 2">
    </div>
    <div class="carousel-item">
      <img src="image3.jpg" alt="Image 3">
    </div>
  </div>
</div>

<style>
  #myCarousel {
    width: 100%;
    height: 0;
    padding-top: 75%; /* 4:3 aspect ratio */
    position: relative;
  }
  #myCarousel .carousel-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  #myCarousel .carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
</style>

<script>
  $(document).ready(function(){
    $('#myCarousel').carousel();
  });
</script>