html img src使用<filename>？参数

我对同一图像有3种不同的尺寸。html img src使用<filename>？参数

我能实现类似如下：

<img src='/path/to/image.jpg'></img> 
<img src='/path/to/image.jpg?small'></img> 
<img src='/path/to/image.jpg?large'></img>

我已经尝试了以上，但它却显示image.jpg

来源

2013-02-15 rikAtee

''元素是一个空元素;因此它没有结束标签;它会自动关闭（标签末尾的'/'） – 2013-02-15 23:10:09

是的，你可以实现这样的事情，你遇到了哪个问题？你在服务器上做了什么？ – 2013-02-15 23:10:41

你试过直接访问url吗？：//youdomain.com/path/to/image.jpg？小，以确保你期望发生的事情发生？ – 2013-02-15 23:14:52

的浏览器不明白你想要做什么。为什么大小不追加到图像的结尾，就像这样：

<img src='/path/to/image.jpg></img> 
<img src='/path/to/image.jpg_small></img> 
<img src='/path/to/image.jpg_large></img>

来源

2013-02-15 23:09:57 mchandleraz

-1

我建议

<img src="/path/to/image.jpg"></img> 
<img src="/path/to/image_small.jpg"></img> 
<img src="/path/to/image_large.jpg"></img>

保持文件扩展名。

来源

2013-02-15 23:12:00 smartmeta

我会建议保持相同的图像，并添加一些CSS风格各一，而不是从它的路径类似调用同一个图像的3倍：

HTML代码

<div> 
    <img src="/path/image.jpg" width="100" height="100"> 
</div> 

<div id="scale-up" style="height: 230px"> 
    <img src="/path/image.jpg"> 
</div> 

<div id="scale-down" style="height: 57px"> 
    <img src="/path/image.jpg">

CSS代码

img { 
    vertical-align: middle; 
    height: 100%; 
} 
#scale-up { 
    height: 230px; 
} 
#scale-down { 
    height: 57px; 
}

来源

2013-02-16 00:26:01 Leo

小将用于最经常（99％的时间）。大用一次，中等不常用。 – rikAtee 2013-02-16 02:11:31

@rikAtee我没有明白你的观点，你能指出更多吗？ – Leo 2013-02-16 05:25:13

大部分（99％）的用户只需要看到缩略图图像，所以我不想为他们提供全尺寸的图像，因为这会花费我的带宽。 – rikAtee 2013-02-16 20:27:00

如果你想文件名看起来像（在服务器上）：

fd11f91bb8361030bdc09d8b8ed4f88e?w=200&h=76&f=png

您需要在向服务器请求时进行url编码。例如使用http://meyerweb.com/eric/tools/dencoder/

所以URL编码的文件看起来像：

fd11f91bb8361030bdc09d8b8ed4f88e%3Fw%3D200%26h%3D76%26f%3Dpng

所以你的情况应该是：

<img src='/path/to/image.jpg'></img> 
<img src='/path/to/image.jpg%3Fsmall'></img> 
<img src='/path/to/image.jpg%3Flarge'></img>

来源

2017-03-11 11:51:37

像@Leo提到的，使用HTML标签（或CSS ）比基于URL的方法容易得多。（这需要服务器逻辑）

的HTML标签大小调整会是什么样子：

<img src="/path/to/image.jpg" width="100" height="100">

你提到你不喜欢怎么可能会增加带宽使用率。只要您的网站使用图像缓存，这应该不成问题。（它只会下载一次图像，然后在本地重新调整不同标记的图像大小）

来源

2017-03-11 11:58:38 Venryx

html img src使用<filename>？参数

回答

相关问题