Принудительное обновление фонового изображения

Есть ли способ убедиться, что последнее обновленное фоновое изображение появилось в последней версии на всех браузерах (а не на старой версии, хранящейся в кеше)?

Это должно быть решение, не затрагивающее строку кода, вызывающего CSS (я мог бы поставить вопросительный знак и номер версии после имени файла css, например: <link href="styles.css?v=2" rel="stylesheet" type="text/css"/>, но в этом случае я не имеют доступ к этой части кода)

Ответ 1

Вы можете использовать следующий подход:

.button {
    background: url(../Images/button.png?v=1234);
}

Ответ 2

Вы можете добавить другое правило CSS после другого CSS, которое отменяет правила, загружающие изображение, и использует изображение с добавленным номером версии.

CSS-правила, загруженные позже, имеют более высокий приоритет, поэтому вы можете использовать тот же селектор, что и в основном CSS, и он переопределит его.

Если вы не можете этого сделать, тогда вы ввернуты. Вы должны изменить URL загружаемого изображения, чтобы получить новое изображение.

Ответ 3

Немногие вещи, которые мне нравятся здесь

Изображения, JS, файлы CSS, указанные в HTML-страницах, кэшируются в браузере на основе URL
Изменение URL-адреса выдает новый запрос на сервер и сохраняет последний в кеше.

Все, что вам нужно сделать, это изменить URL.

Хотя вы изменили таблицу стилей CSS, вам нужно обновить HTML-ссылку для CSS.

background: url(../Images/button.png?v=1234);

Пример: http://www.site.com/css/style.css до http://www.site.com/css/style.css?ver=002

<link rel="stylesheet" href="css/style.css?ver=002" type="text/css" />

Ответ 4

Вы можете добавить Expires в htaccess, но если изображение действительно велико, я бы посоветовал это сделать. Как вы просите без CSS, попробуйте:

<Files "your_bg.jpg">
FileETag None
<ifModule mod_headers.c>
Header unset ETag
Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT"
</ifModule>
</Files>