今天手動添加了一段html代碼,沒想到確出現了讓人”百思不得其解“的意外,看下面一段Html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/Html4/loose.dtd">

<html XMLns="http://www.w3.org/1999/xHtml">

<head>

<meta http-equiv="Content-Type" content="text/Html; charset=gb2312">

<title>無標題文檔</title>

</head>

<body>

<table border="0" cellpadding="0" cellspacing="0" bgcolor="#990099">

<tr>

<td><img src="images/bar1.gif" alt="" width="200" height="38" />

</td>

<td><img src="images/bar2.gif" alt="" width="136" height="38" />

</td>

<td>

</td>

</tr>

</table>

<table border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFF00">

<tr>

<td><img src="images/bar1.gif" alt="" width="200" height="38" /></td>

<td><img src="images/bar2.gif" alt="" width="136" height="38" /></td>

<td> </td>

</tr>

</table>

</body>

</Html>
在IE中浏覽:

在Firefox中浏覽:

兩端代碼幾乎一樣的代碼確在不同浏覽器中出現了迥然不同的效果,而這種區別又是如此的總要,因為我們常常這樣來拼接切割後的圖片。
其實,仔細觀察就會發現,兩端Html唯一不同的就是第一段中<img/>是換了行之後才跟</td>,而第二段代碼<img>是緊跟</td>的,正是如此,IE認為第一段代碼<img>和</td>產生了空格(雖然有無限個空格,但只解析為一個),導致出現了占位符,而Firefox忽略不計。
本來是認為代碼1,風格比較好,樹樁對齊,沒想到浪費了我一個多小時的調試。^^||