2

我在两个网站上看到了以下 CSS 规则

/* First example */
background: #F8F8F8 url('/images/noise.png?1333540701') top left;
/* Second example from a different site */
background: #F8F8F8 url('/images/noise.png?1326131369') top left;

*.png?randomNumberspng图像路径后是什么意思？他们在这里服务的目的是什么？

第一个来自bastsov，另一个来自Matt Gemmell。两者都使用 Octopress 框架。

编辑 这两个规则并不是在同一个站点上使用的。每个规则来自不同的站点。

此外，似乎他们在任何地方都使用相同的数字，无论何时noise.png提及。例如，

/* rule for navigation bar */
background: url('/images/noise.png?1333540701'),linear-gradient(#E0E0E0,#CCC,#B0B0B0)
/* rule for #main */
background: #F2F2F2 url('/images/noise.png?1333540701') top left;

我在Matt Gemmell的网站上观察到了相同的模式，但数字不同。

4

3 回答 3

5

很可能这是对图像进行版本控制的一种方式，因为它们可能正在缓存图像。这样，如果图像被更新，他们可以更改数字以避免获取较旧的缓存图像。

于 2012-06-03T18:54:27.560 回答
3

随机数是GET发送到图像路径的请求。由于图像只是一个静态资源，因此当您将参数传递给它时，除了它的 URL 之外，什么都不会改变。

浏览器缓存图像以加快页面加载速度，但如果您更改图像的 URL，浏览器会重新下载图像。似乎noise.png每次都需要重新加载。

于 2012-06-03T18:55:10.290 回答
3

该数字只是发送到服务器以获取图像的 URL 的一部分。

这样做有两个常见的原因：

  • 服务端的资源不是静态文件，是由代码处理的，根据数量返回不同的图片。
  • 服务器会忽略该数字，它只是用于生成不同的 URL。这通常是出于缓存原因，因此更改数字将强制向服务器发出新请求。

在这种情况下，第二个原因似乎更有可能。当查询字符串用于返回不同的图像时，资源名称通常更通用。

于 2012-06-03T19:01:19.097 回答