向HTML表格添加圖像會破壞表格

-4

向html表格（三列圖像）添加額外的行時 - 添加新徽標會導致表格斷裂，並且第一行會擴大到約900px寬。任何可能導致這種劇烈變化的想法？向HTML表格添加圖像會破壞表格

（1000線可能有點多，所以我會添加的代碼看起來下來整個表的樣本。）

<tr> 
<td style="text-align: center;"> 
<p> 
<img alt="Safelok" src="http://www.optrafair-london.co.uk/g/2014/logo/hilco_10_safelok_logo.jpg" style="width: 85px; height: 57px;" /></p> 
</td> 
<td style="text-align: center;"> 
<br /> 
<a href="http://www.optrafair-london.co.uk/Exhibitor/SPECSAVERS-OPTICAL-SUPERSTORES-LTD" target="_blank"><img alt="Specsavers" src="http://www.optrafair-london.co.uk/g/2014/logos/specsavers_resized.jpg" style="width: 122px; height: 50px;" /></a></td> 
<td style="text-align: center;"> 
<img alt="Ziggi" src="http://www.optrafair-london.co.uk/g/2014/logos/capitol_ziggi.jpg" style="width: 126px; height: 62px;" /></td> 
</tr> 
</tbody> 
</table>

現在我知道，每個圖像的合併像素寬度沒有按不會超過內容邊界（包括填充），並且沒有關聯的CSS附加到圖像，以添加填充或未知的東西 - 但是當添加圖像時 - 發生這種情況： http://www.optrafair-london.co.uk/page.cfm/Link=25/t=m/

來源

2013-11-25 Sam May

而不是從一個大文件中翻錄一個片段，你可以做一個最小的但完整的例子，而不是簡單地說明問題？ – Flexo

代碼表包含一個圖像有一個比table更大的尺寸當你不提列width明確地說，HTML將其留給瀏覽器。當你特別提到width並試圖放大圖像時，HTML表格會發生一些劇烈變化 - 這可能是由於您面臨的情況更糟。

將您的HTML元素與適當的CSS硬鍵結合是一種很好的做法。再加上它，當你設計一個網頁時，你不會在一個小區域放大圖像。如果，您將搜索stackoverflow徽標，那麼您會發現它的大小不同，這是如何完成的。

您計算了佈局的pixel。
將圖像轉換爲大小。
將圖像放在適當的地方。

在任何你想要的地方放置任意大小的圖像從來都不是好習慣。

來源

2013-11-25 11:27:19

謝謝維爾 - 但我已經檢查了桌子下所有圖像的寬度，沒有超出我能看到的內容區域的寬度。（包括填充） –

向HTML表格添加圖像會破壞表格

回答

相關問題