W3C的文檔指出以下幾點:如何在網頁瀏覽器中處理圖像像素?
像素(PX)是相對於所述觀看設備。對於低dpi設備,1px是顯示器的一個設備像素(點)。對於打印機和高分辨率屏幕1px意味着多個設備像素。
這種類型的標準元素,如divs和表格是有意義的。如果屏幕具有更大的像素密度,則爲CSS像素預留更多實像素,以便在所有屏幕上保持實際元素大小基本相等,而不管其密度如何。在這個意義上,CSS像素可以被看作僞絕對長度測量。
但對於圖像?我知道讓瀏覽器調整圖像大小是不好的做法。但接下來如何處理源圖像的像素?我想它不可能與其他元素相同,否則我會在高密度屏幕上獲得低分辨率圖像,因爲將更多設備像素分配給單個圖像像素。
根據您的答案,瀏覽器執行某種插值時的圖像分辨率不適合屏幕。這是我們想要避免的,以防止圖像退化。它是這樣,我將不得不爲每個屏幕密度提供一個不同的圖像。 –
是的,這就是爲什麼一些WordPress主題要求您的原始圖像具有完美的比例,而不是強制GC拉伸像素,因此需要額外的Retina準備圖像(圖像大小的兩倍)。 –