如何使用百分比作为参数在HTML中调整图像大小？ [英] How to resize image in HTML using percentage as parameters?

问题描述

我想在我的网站上调整图片大小。我知道如何通过调整图像大小或计算宽度和高度并设置像素值。但我多次使用相同的图片和不同的内容，因此如果我可以调整图片的大小，我会花更少的时间。

code>< img src ='images / logo-beta.png'id =logoheight =75％width =75％/>

我已经试过了，但问题在于相对于其父元素设置了大小。 / p>

解决方案

没有办法单独使用HTML或CSS来自动执行。您需要使用JavaScript来获取图片的尺寸，然后计算这些尺寸的百分比并将其重新应用到图片中（像素为单位）。

I would like to resize an image on my website. I know how to do it by either resizing the image before or calculating the width and height and setting the values in pixels. But I use the same picture multiple times with different dimmensions, so it would take me less time if I could resize the image relatively to its own size.

<img src='images/logo-beta.png' id="logo" height="75%" width="75%"/>

I have tried this, however the problem is that the size is set relative to its parent element.

解决方案

There's no way to do what you want automatically using HTML or CSS alone. You'll need to use JavaScript to get the image's dimensions, then calculate a percentage of those dimensions and reapply them to the image in pixels

这篇关于如何使用百分比作为参数在HTML中调整图像大小？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！