CSS背景圖片

Question

我有一個帶有背景圖像的登錄頁面，該頁面在本地顯示，但是當我實時將其推出時，我無法在互聯網上看到它。

我的文件結構非常簡單，我有一個名為runn的根文件夾，在該文件夾中有一個css文件夾，一個圖像文件夾等。

以下是我的背景圖片的CSS。

body {
    color: white;
    background: #ee6184;
    background-image: url('../images/image_01.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 180%;
    margin: 0; 
    padding: 0;
    width: 100%;
    text-align: center;
}

Answer 1

查看瀏覽器控制台（或網絡），也許它顯示此圖像的404錯誤。 這意味着您的路徑不適用於該服務器，並且也可能是403（禁止）或其他錯誤。

此外，您還可以設置路徑/images/image_01.jpg ：如果根是不是這樣子domain.com/runn/ 。

請通過其他方式添加鏈接，以便我理解該問題。

Answer 2

通常，當調試映像未按預期顯示時，請進入chrome控制台，查看是否有404提示找不到資源。

background-image: url('../images/image_01.jpg');

這意味着在您用html編寫的路徑中不存在此類文件。 然后重新配置圖像路徑或將資源上傳到正確的路徑。

在這種情況下，您可以在CSS中使用相對路徑

background-image: url('../images/image_01.jpg');

或者您可以在服務器語言文件（例如php）中使用絕對路徑

background-image: url('<?php echo site_url();?>/images/image_01.jpg');