Tuesday, May 10, 2022

How TO - Responsive Images

 https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_image_responsive

 <!DOCTYPE html>

<html>

<head>

<meta name="viewport" content="width=device-width, initial-scale=1">

<style>

.responsive {

  width: 100%;

  height: auto;

}

</style>

</head>

<body>


<h2>Responsive Images</h2>


<p>If you want the image to scale both up and down on responsiveness, set the CSS width property to 100% and height to auto.</p>

<p>Resize the browser window to see the effect.</p>


<img src="img_nature.jpg" alt="Nature" class="responsive" width="600" height="400">


</body>

</html>


No comments:

Post a Comment

Html, CSS, and JavaScript projects for beginners with source code

  Html, CSS, and JavaScript projects for beginners with source code Get started now!!! All source code is available for free. 1A) Build a M...