CSS 圖片查找路徑 在 Web 開發中，通常需要在網頁中添加圖片。為了在 CSS 代碼中正確引用圖片資源，我們需要了解如何查找圖片路徑。 圖片的路徑有兩種方式：絕對路徑和相對路徑。 1. 絕對路徑 絕對路徑是指從根目錄開始一直到指定文件的完整路徑。例如，如果我們有一張圖片存儲在 C 盤的 Images 文件夾中，我們可以使用以下路徑來引用它： `background-image: url("C:/Images/pic.jpg");` 這種方式雖然可行，但不夠靈活。如果我們將網站移動到別的地方，這些絕對路徑可能就無法正確引用。 2. 相對路徑 相對路徑是指相對于當前文檔的路徑來引用圖片。這種方式更加靈活，因為它不依賴于文件系統的絕對路徑。我們可以使用以下方式來引用圖片： - 相對于當前文檔的同級目錄 `background-image: url("pic.jpg");` - 相對于當前文檔的上級目錄 `background-image: url("../pic.jpg");` - 相對于當前文檔的下級目錄 `background-image: url("images/pic.jpg");` - 相對于根目錄 `background-image: url("/images/pic.jpg");` 需要注意的是，我們在引用圖片時，文件名的大小寫必須與實際文件名相同，否則會出現找不到文件的情況。 在編寫 CSS 代碼時，我們可以使用 Chrome、Firefox 等瀏覽器的開發者工具來測試圖片路徑是否正確。可以在 Elements 或 Network 標簽中查看資源文件的路徑和狀態碼。 總結 正確的圖片查找路徑可以讓網站更加穩定和可維護。在實際開發中，我們應該盡可能采用相對路徑，以保證圖片資源的可靠性和可移植性。