css中某个图片不缓存

admin 轻心小站 关注 LV.19 运营
发表于前端技术学习版块 css,教程

CSS中某个图片不缓存的问题是在网页开发中常遇到的一个问题。一般情况下,浏览器会自动缓存进行访问的网页中的内容,包括CSS文件、JavaScript文件、图片等。这个特性能够加快网页的加载速度并减少服

CSS中某个图片不缓存的问题是在网页开发中常遇到的一个问题。一般情况下,浏览器会自动缓存进行访问的网页中的内容,包括CSS文件、JavaScript文件、图片等。这个特性能够加快网页的加载速度并减少服务器资源的使用,提高用户体验。但是有时候我们需要在CSS中设置某个图片不被浏览器所缓存,比如需要重新加载最新版本的图片,那么该怎么做呢?

// CSS代码
.selector {
   background-image: url('image.png?_v=1.0');
} 

我们可以在图片的URL后面添加一个查询字符串,通过不停地变化这个查询字符串的值来让浏览器无法缓存图片,强制浏览器重新加载最新版本的图片。如上方代码所示,在图片的URL后面添加了一个查询字符串“_v=1.0”,当我们需要更新图片时,只需要将“1.0”改成其他值,如“2.0”,即可重新加载一张更新后的图片。

这里需要注意的是要用“?”将图片URL与查询字符串分隔开,而不是“&”。

总之,我们可以通过添加查询字符串的方式让CSS中的某个图片不被浏览器缓存,从而实现强制浏览器重新加载最新版本的图片。

文章说明:

本文原创发布于探乎站长论坛,未经许可,禁止转载。

题图来自Unsplash,基于CC0协议

该文观点仅代表作者本人,探乎站长论坛平台仅提供信息存储空间服务。

评论列表 评论
发布评论

评论: css中某个图片不缓存

粉丝

0

关注

0

收藏

0

已有0次打赏