search

Home  >  Article  >  Web Front-end  >  How to shrink an image using CSS to make it responsive

How to shrink an image using CSS to make it responsive

王林
王林forward
2023-08-23 20:05:021160browse

How to shrink an image using CSS to make it responsive

To make the image responsive, you can try running the following code:

Example

Live Demo

<!DOCTYPE html>
<html>
   <head>
      <style>
         img {
            max-width: 100%;
            height: auto;
         }
      </style>
   </head>
   <body>
      <img src = "https://www.tutorialspoint.com/videotutorials/images/coding_ground_home.jpg" alt = "Online Compiler" width = "300" height = "300">
   </body>
</html>

The above is the detailed content of How to shrink an image using CSS to make it responsive. For more information, please follow other related articles on the PHP Chinese website!

css
Statement：
This article is reproduced at:tutorialspoint.com. If there is any infringement, please contact admin@php.cn delete
Previous article：What is the box model in CSS?Next article：What is the box model in CSS?

Related articles

See more