HTML表格如何並排顯示一組元素

Question

我有嵌套在foreach循環中的表元素，該循環顯示人的個人資料圖片。 我的問題是所有圖片都顯示在彼此的頂部。 如何將圖片並排放置？ 這是我的代碼：

<table cellpadding="0" style="width:80%; " cellspacing="0">
    @foreach (var item in Model)
    {
        <tbody style="float:left;">
    <tr><td><img height="50" width="50" src="@Url.Content("~/uploads/profilepic/"+item.foldername+"/"+item.photo)" alt="" /></td></tr>
</tbody>
    }
</table>

我在那里大約有20張照片，似乎無法將它們並排放置，任何建議都很好。

Answer 1

代替為每個用戶創建行，而是創建一列：

<table cellpadding="0" style="width:80%; " cellspacing="0">
<tbody><tr>

    @foreach (var item in Model)
    {
        <td><img height="50" width="50" src="@Url.Content("~/uploads/profilepic/"+item.foldername+"/"+item.photo)" alt="" /></td>
    }

</tr></tbody>
</table>

Answer 2

使用tr標簽，您可以開始新的一行。 如果要在一行中顯示多個項目，則必須“使行保持打開狀態”。 您可以使用簡單的計數器變量，以允許每行一定數量的圖片。