Make an image responsive with Bootstrap

BootstrapWeb DevelopmentCSS Framework

To make an image responsive in Bootstrap, add a class .img-responsive to the <img> tag. This class applies max-width: 100%; and height: auto; to the image so that it scales nicely to the parent element.

The following is how you can simply make an image responsive −


 Live Demo

<!DOCTYPE html>
      <title>Bootstrap Example</title>
      <link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet">
      <script src = "/scripts/jquery.min.js"></script>
      <script src = "/bootstrap/js/bootstrap.min.js"></script>
      <img src = "" class = "img-responsive" alt = "Online Training">
Published on 14-Jun-2018 10:57:07