调整图像大小时,1rem显示为1px



我目前正在尝试建立一个网站,其中包括一个大小更大的小像素艺术图像,根据互联网的建议,我正在使用rem来确保一切都能很好地调整大小。

然而,我在调整图像大小时遇到了一个问题。当我尝试调整它的大小时,它将1 rem视为等于1 px。因此,以下代码将显示为16px乘12px的图像:

<img src="image.png" width="16rem" height="12rem">

怎么回事?根据我读到的所有内容,它应该显示为256px乘192px的图像。我的字体和div的大小都和我预期的完全一样,所以我不知道为什么我的图像会出现问题。

谢谢!

<img>标记内的heightwidth属性始终以像素为单位进行测量——实际上,您通常不会在这些属性中写入单位——只是数字。

要实现您想要的内容,请使用CSS样式表(以及其中应用于<img>标记的类或ID的规则(,或使用img标记中的style属性,如:

<img src="image.png" style="width:16rem;height:12rem;">

附言:你写的";根据互联网的建议,我正在使用rem来确保一切都能很好地调整大小":我不知道哪个";互联网";向您推荐;-(,但是——如果有的话——它只适用于某些东西(首先是字体大小(,而不是所有东西,尤其是图像。

最新更新