Board logo

主題: [求助] [問題] 問一個 HTML 在不同瀏覽器的顯示問題 [打印本頁]
發表人: jocosn    時間: 2005-9-28 01:29 AM     主題: [問題] 問一個 HTML 在不同瀏覽器的顯示問題

我想達到圖一的效果
下面一排3個相同藍色圖形 使用語法
<table border="0" width="80%"  cellspacing="0" cellpadding="1">
　<tr>
　　<td width="120"><img border="0" src="010005.JPG"></td>
　　<td width="120"><img border="0" src="010005.JPG"></td>
　　<td width="120"><img border="0" src="010005.JPG"></td>
　　<td>　</td>
　</tr>
</table>

在 IE 和 firefox 顯示下都相同


但是如果改一下把圖片間的空白去掉
<table border="0" width="80%"  cellspacing="0" cellpadding="0">
　<tr>
　　<td width="120"><img border="0" src="010005.JPG"></td>
　　<td width="120"><img border="0" src="010005.JPG"></td>
　　<td width="120"><img border="0" src="010005.JPG"></td>
　　<td>　</td>
　</tr>
</table>

firefox 沒問題，但是 IE 的圖片整個散開來，請問要怎麼解決這個問題？

測試的作業環境
WINDOWS 2003
IE 6.0.3790.0
firefox 1.0.7

[jocosn 在 2005-9-28 01:40 AM 作了最後編輯]

附件: ie6.jpg (2005-9-28 01:29 AM, 7.58 K) / 該附件被下載次數 24
http://twed2k.org/attachment.php?aid=15840

附件: 010005.JPG (2005-9-28 01:29 AM, 12.28 K) / 該附件被下載次數 24
http://twed2k.org/attachment.php?aid=15842

附件: same1.jpg (2005-9-28 01:29 AM, 7.34 K) / 該附件被下載次數 25
http://twed2k.org/attachment.php?aid=15839
發表人: 小斌    時間: 2005-9-28 10:07 PM

去掉
width="80%"
應該就可以達成你想要的樣子。

因為你設定了表格的寬度為 80%，所以圖片會因為表格變大而散開來。
來做個小測試。試試看開你原來的網頁將 IE 視窗縮小一點，是不是圖的間隔也會變小？
那是因為表格隨著瀏覽器的寬度縮小而變小了。這樣解說能瞭解嗎？會不會太抽象？

不過，只是要顯示圖片，何必用到表格？
表格的用途是表列資料，不是用來排版的。

[小斌 在 2005-9-28 10:13 PM 作了最後編輯]
發表人: jocosn    時間: 2005-9-28 11:20 PM


引用:
小斌寫到:
去掉
width="80%"
應該就可以達成你想要的樣子。

因為你設定了表格的寬度為 80%，所以圖片會因為表格變大而散開來。
來做個小測試。試試看開你原來的網頁將 IE 視窗縮小一點，是不是圖的間隔也會變小？
那是因為表格隨著瀏覽器的寬度縮小而變小了。這樣解說能瞭解嗎？會不會太抽象？

不過，只是要顯示圖片，何必用到表格？
表格的用途是表列資料，不是用來排版的。

[小斌 在 2005-9-28 10:13 PM 作了最後編輯]


感謝，確實去掉 width="80%" 就可以了。

小弟做幾點說明並有幾個問題：
1. 目前暫時放圖片，以後要加說明文字在圖片下方，所以想說用表格比較好排版和修改，還是有其他解決辦法？我想到一個用 CSS 做版面編排，但是 CSS 的位置不好控制和不利日後修改維護，不知是否有純以 HTML 解決的方案？或是只能用 CSS 解決？

2. 我試過用這樣
<table border="1" width="80%"  cellspacing="0" cellpadding="0" id="table3">
　<tr>
　　<td width="120"><img border="0" src="010005.JPG"></td>
　　<td width="120"><img border="0" src="010005.JPG"></td>
　　<td width="120"><img border="0" src="010005.JPG"></td>
　　<td>　</td>
　</tr>
</table>
也就是 border 設為顯示，這樣我的 width=80% 仍然 OK，圖片也不會散開。
但是去掉 boder(也就是變為 0)，則圖片就會散開，這樣不管是否設 width=80% 都沒關係，照理講，有沒有加 "border=0 或 1 " ，應該是只牽涉到邊線是否顯示而已，但是 IE 卻會出現圖片散開的情況，，請問這是 IE6 的定位 BUG 嗎？因為 firefox 不管怎麼樣都顯示正常(border=0或1，cellspacing=0或1，cellpadding=0或1 皆可，圖片都不會散開)。

有沒有辦法讓我保留 width="80%"，但是 border=0 cellspacing="0" cellpadding="0" 的情況下，達到圖片不會散置的現象？

[jocosn 在 2005-9-28 11:22 PM 作了最後編輯]
發表人: beam    時間: 2005-9-29 10:36 AM

試試最後一個td width=100%
發表人: jocosn    時間: 2005-9-29 03:13 PM


引用:
beam寫到:
試試最後一個td width=100%


那如果一定要讓左右兩邊留白變大呢？
如果想設定 80% 就變無解嗎？



歡迎光臨 TWed2k (http://twed2k.org/) Powered by Discuz! 4.1.0