CSS高品質圖像

Question

iPhone 4.0具有視網膜顯示屏，您可以使用background-size CSS3屬性升級網頁圖像。並非所有的瀏覽器都支持CSS3，但（尤其是IE），luckely我們有以下的代碼來幫助我們：

@media only screen and (-webkit-min-device-pixel-ratio:2) { } 

但是，儘管這似乎代碼足夠它的目的，它不是。我想發表如下聲明：

IF BROWSER SUPPORTS BACKGROUND-SIZE THEN { ... } (in CSS) 

你爲什麼要問？那麼，三星Galaxy S可以顯示真正清晰的圖像以及背景大小，但沒有像素比2.0來觸發CSS。

任何人都可以幫我嗎？

Answer 1

我認爲你正在尋找一個像modernizr的圖書館:) Modernizr允許檢測客戶端是否支持新功能（尤其是css3）。

用簡單的CSS你可以區分瀏覽器和調整你的代碼。

這裏是您需要的部分： http://www.modernizr.com/docs/#backgroundsize

哦也，感謝對你的視網膜提示;）

Answer 2

還有就是W3C CSS工作組有關adding feature queries to CSS中的一些討論。該建議是有沿着這些路線語法：

@supports (background-size) { 
    ... 
} 

然而，即使接受了，這將是幾年這些提案達成瀏覽器前。現在你用Tim所描述的modernizr方法更好。