通过数据库插入的不同大小图像的宽度和高度HTML属性



我有一个不同大小的图像库,它们的路径存储在数据库中。图像是用PHP和MySQL存储过程获取的。我试着用PHP:为<img>添加宽度和高度属性

width="<?php list($width, $height) = getimagesize($row['modal_img_src']); echo $width; ?>"
height="<?php list($width, $height) = getimagesize($row['modal_img_src']); echo $height; ?>"

但这显然给了我内在的维度,而不是浏览器实际使用的维度。

我需要JavaScript让浏览器知道每个图像实际使用的宽度和高度吗?

编辑:我也可以在数据库中存储每个图像的宽度和高度。(?(

目前尚不清楚您的目标是什么。浏览器通常可以很好地检测内部图像大小(添加它们的一个原因是在图像加载较慢时减少内容偏移(。

如果你有特定的尺寸来显示图像,不管它的内在尺寸是什么,你都应该通过CSS将其卸载到浏览器中。指定像max-widthmax-height这样的东西可能会让你到达你需要的地方

或者,如果您想要更多的控制,可以在非图像元素上使用CSSbackground-image属性。这允许您控制它通过background-size进行缩放的方式。

在我看来,这两种解决方案中的任何一种都比在这种情况下使用JS要好。

同样为了完整性,如果您最终使用了get_image_size,请确保只调用一次并检查其返回值。

最新更新