To maintain the image size without changes, there are various methods you can implement.
<!DOCTYPE html>
<html>
<style>
img {
width = 100px;//or any size you desire but not in '%'
height = auto;//or in px or in em
}
</style>
<body>
<img src="imgsrc" alt='img'>
</body>
</html>
You have the flexibility to choose any width size, ensuring to use an absolute unit for measurement. In CSS, the following absolute units can be utilized:
- cm (centimeters)
- mm (millimeters)
- in (inches)
- px (pixels)
- pt (points, where 1 point equals 72nd part of an inch)
- pc (picas, with 1 pica as the 12th part of a point)
If needed, 'em' can also be used, representing the current font size. You can then convert this into an absolute pixel value which remains consistent despite browser resizing.
The same principles apply to height, recommending to set it as auto
to preserve the original image's aspect ratio.
For a detailed look into CSS length units, consult this w3-school reference guide.