`display:none` 真的會阻止圖片載入嗎？

「display:none」對圖片載入的影響

許多響應式網站開發教學建議使用「display:none」CSS 屬性來隱藏內容，使其不顯示在行動瀏覽器上，從而加快網站載入時間。然而，「display:none」真的會阻止圖像載入嗎？

「display:none」會停止圖片載入嗎？

瀏覽器變得更加複雜。今天，根據其版本，如果瀏覽器確定圖像不相關，則可能會避免載入圖像。

雖然圖像可能分配了「display:none」樣式，但腳本仍然可以存取其尺寸。在隱藏父元素的情況下，Chrome 版本 68.0 會忽略映像載入。

「display:none」的替代方案

如果您特別想阻止圖像加載，考慮以下技術：

• 從document.
• 將IMG src 屬性設定為「data:」或「about:blank」。

「display:none」的限制

「display: none」對於初始螢幕上顯示且非延遲載入的圖片可能無效。圖像將加載，但不可見。

以上是`display:none` 真的會阻止圖片載入嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！