Trying to have HTML image auto resize when browser size shrinks-CodePudding

I'm rather bad at HTML and looking to have an image resize itself automatically when the browser size is changed (zooming in and out). This is for an ebay listing template. The template as a whole is perfect minus the image does not fit the same when zooming in and out. Any help is appreciated. Thank you.

<h1 style="text-align: center; line-height: 100%"><font face="Arial" style="font-size: 14pt; color: rgb(53, 53, 53);"><img alt="Aleq"  src="https://example.com">

CodePudding user response：

For the image to resize based on the browser width change, you can take a look at this resource. It talks about few css tricks you can do to make your images responsive.

https://www.w3schools.com/css/css_rwd_images.asp

CodePudding user response：

A simple way of doing this would be to add a max-width property to your image in your css file.

For example, if you gave your image a class of "stackoverflow-img" it would be:

<style>
    .stackoverflow-image{
        max-width: 100%;
    }
</style>