當我將doctype添加到我的網頁時，圖片無法加載

我需要在我的html網頁中添加doctype，因爲如果我這樣做，IE只會正確格式化它。但是當我添加它時，頁面上的一些圖像沒有加載。圖像嵌入CSS背景屬性並顯示在屏幕上div s。它不會在所有常見瀏覽器中加載圖像。當我將doctype添加到我的網頁時，圖片無法加載

可能是什麼問題？我真的需要doctype了。

CSS：

.blue { 
    position: absolute; 
    background: url(blue.png) no-repeat center center; 
    top: 163; 
    width: 228; 
    height: 434; 
} 

.green { 
    position: absolute; 
    background: url(green.png) no-repeat center center; 
    top: 120; 
    width: 266; 
    height: 209; 
} 

.orange { 
    position: absolute; 
    background: url(orange.png) no-repeat center center; 
    top: 183; 
    width: 165; 
    height: 291; 
}

HTML：

<div class="blue"> </div> 
<div class="green"> </div> 
<div class="orange"> </div>

文檔類型頂部：

不需要

<!DOCTYPE html>

來源

2012-06-21 Qasim

No codez no answer。 –

最有可能你正在使用一些非標準的CSS。請發佈小的HTML片段和CSS片段。還要考慮檢查您正在使用的瀏覽器的開發工具（F12）中的控制檯輸出和樣式，以便爲該問題添加更多詳細信息。 –

@Derek添加代碼。對不起，我認爲這可能是一個明顯的問題，我想它確實需要代碼，因爲無效的CSS建議 – Qasim

我認爲它與你的CSS寬度和高度聲明沒有'px'結尾有關。

您可以檢查<div>元素是否以寬度和高度呈現以顯示背景圖片？

來源

2012-06-21 00:51:59

賓果。我正在粗心大意，沒有注意到。我從來沒有經常使用doctypes，但感謝這一點。現在我知道我不應該做草率的編碼。 – Qasim

（你應該接受這個答案） –

，但不錯的：你缺少周圍網址報價：http://www.w3.org/TR/CSS2/colors.html#propdef-background-image

background: url("orange.png") no-repeat center center;

來源

2012-06-21 00:43:12

即使在「url」附加引號後，我仍然沒有運氣。 – Qasim

我有一個類似的div爲我的網站的標誌，它加載得很好。我有一個奇怪的錯誤。 – Qasim

我認爲這與絕對定位有關？這是我給你展示的3個div和logo之間的唯一區別CSS – Qasim

問題是HTML5是HTML5嚴格要求單位的值，否則將被忽略。您需要將px添加到所有位置高度和寬度數字的末尾。阿列克謝也正確地指出你的網址也需要引用他們的引號。

來源

2012-06-21 01:02:18 LINEMAN78

當我將doctype添加到我的網頁時，圖片無法加載

回答

相關問題