緩存CSS中的圖像破壞

試圖找出在CSS文件中緩存圖像的最佳方法。緩存CSS中的圖像破壞

說我是使用CSS精靈和我所用的一個圖像爲像10種不同的元素作爲scuh ..

.element1 { 
    background: url('../images/main-nav.png') left -80px no-repeat; 
} 

.element2 { 
    background: url('../images/main-nav.png') left -120px no-repeat; 
} 

.element3 { 
    background: url('../images/main-nav.png') left -160px no-repeat; 
}

然後我更新的圖像，我想添加一個新的元件，諸如..

.new_element { 
    background: url('../images/main-nav.png') left -200px no-repeat; 
}

我知道我可以做這樣的事情緩存胸圍這樣：

.new_element { 
    background: url('../images/main-nav.png?v=1.01') left -200px no-repeat; 
}

，但不會現在由於不同的文件名而導致2個請求？ ...我是否真的必須更新對這個圖像的每一個引用，以避免對同一圖像的多個請求？ ...或者，還有更好的方法？

來源

2014-07-22 Brett

@Hushme唉唉....這是一個非常好的問題。 :) – Brett

@Hushme隨意添加它作爲答案，如果你喜歡。 – Brett

你可以使用一個共同的class爲background-image比你可以使用background-position每個元素class

來源

2014-07-22 06:58:08 Hushme

緩存CSS中的圖像破壞

回答

相關問題