CSS中的圖像版本控制，如何？

Question

我正在尋找在CSS中清除圖像的正確方法。

使用如下所示的幾種方法，很容易將版本控制應用於PHP中的css，js和圖像鏈接：如何強制瀏覽器重新加載緩存的CSS / JS文件？

但是我無法弄清楚如何為css文件中的引用鏈接提供動態版本，或者如何提供強制刷新css引用的任何其他方法。

Answer 1

現有的大多數解決方案都用於.html而不是.php頁面的版本控制。

在PHP中，您不必使用：

<LINK REL=StyleSheet HREF="style.css" TYPE="text/css">

使用PHP，您可以包含CSS。

您可以設置Cache-Control: max-age
您的CSS將緩存與HTML相同的時間。
即使您使用LINK REL進行版本控制，瀏覽器也無法獲取HTML來找到您將LINK更改為CSS。

保存HTTP Round TTFB

如果“包含”，則緩存在CSS上關系不大。 您沒有HTTP往返連接和等待時間，除非您有過多的CSS，否則內容傳輸時間通常小於到第一個字節的連接時間。

GoDaddy示例

如果HTML傳輸中包含CSS和字體，則此頁面將早於2秒鍾加載。

CSS文件內容傳輸時間1毫秒總時間589毫秒

URL: https://cloud.typography.com/7914312/697366/css/fonts.css
Loaded By: https://www.godaddy.com/:15
Host: cloud.typography.com
Client Port: 0
Request Start: 1.404 s
DNS Lookup: 103 ms
Initial Connection: 36 ms
SSL Negotiation: 90 ms
Time to First Byte: 359 ms
Content Download: 1 ms

瀑布頁面加載

<?php 
ob_start("ob_gzhandler");
header('Content-Type: text/html; charset=utf-8');

header('Cache-Control: max-age=86400');  
// 86400 caches for one day, 604800=week, 2592000=30 days

echo <<<EOT
<!DOCTYPE html>
<html lang="en"><head><title>PHP Testbed</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style type="text/css">
EOT;
ob_flush();


include('css.inc');


echo <<<EOT
</style></head><body><div id="page"><h1>TEST</h1>
</div></body></html>
EOT;
 ob_end_flush();
?>

CSS中的圖像版本控制，如何？

問題描述

1 個解決方案

解決方案1
0 2015-05-03 01:05:28

CSS中的圖像版本控制，如何？

問題描述

1 個解決方案

解決方案1 0 2015-05-03 01:05:28

解決方案1
0 2015-05-03 01:05:28