How do you create responsive images in Bootstrap?

Bootstrap provides classes for responsive image behavior:

<!-- Responsive image that scales with parent width -->
<img src="image.jpg" class="img-responsive" alt="Responsive image">

<!-- Bootstrap 4+ uses img-fluid -->
<img src="image.jpg" class="img-fluid" alt="Responsive image">

<!-- Image shapes -->
<img src="image.jpg" class="img-thumbnail" alt="Thumbnail">
<img src="image.jpg" class="rounded" alt="Rounded corners">
<img src="image.jpg" class="rounded-circle" alt="Circular image">

<!-- Figure with caption -->
<figure class="figure">
  <img src="image.jpg" class="figure-img img-fluid rounded" alt="Figure">
  <figcaption class="figure-caption">Image caption</figcaption>
</figure>

The img-fluid class applies max-width: 100% and height: auto for responsive scaling.