爲什麼colspan沒有按預期的方式應用

我有一個表格如下。第二行定義了三列，一列爲colspan=8，另一列爲colspan=1。儘管如此，這些細胞並未根據colspan進行拉伸，第二個細胞的「寬度」更多一些，第三個細胞的「寬度」更寬一些。爲什麼colspan沒有按預期的方式應用

<table class="floating simpletable"> 
    <tbody> 
     <tr><td colspan="10">1st row</td></tr> 
     <tr><td colspan="8">Column 1 -&gt; Least wide</td><td colspan="1">2nd</td><td colspan="1">3rd</td></tr> 
     <tr><td colspan="10">3rd row</td></tr> 
     <tr><td colspan="1">1st cell</td><td colspan="9">4th row</td></tr> 
    </tbody> 
</table>

什麼問題，以及如何解決它？

來源

2012-02-13 Nicsoft

哪裏是包含10個單元格的行？ – ZippyV 2012-02-13 08:17:16

這是第一行。我是否必須以某種方式定義具有10個單元格的行？ – Nicsoft 2012-02-13 08:20:12

-1是什麼？請給出意見！ – Nicsoft 2012-02-13 08:25:18

單元格的寬度取決於單元格內容，HTML和CSS設置的寬度，瀏覽器以及可能的月相。 colspan屬性只是指定一個單元格佔用多少列（因此表格的網格中有多少個槽）。

如果您看到第2行的最後一個單元格爲最寬，那麼原因可能是它的內容最多（或者存在寬度設置）。您的演示代碼不會顯示這種行爲。

如果您不希望列寬調整爲單元格的大小要求，請在CSS（或HTML）中明確設置寬度。在此之前，最好從表格結構中刪除所有不必要的複雜情況。如果您的演示代碼反映了整個結構，那麼第2列到第8列是不必要的分割，即它們可以轉向單列。演示（差式像素寬度只是定性）：

<table class="floating simpletable" border> 
    <col width=100><col width=100><col width=100> 
    <tbody> 
     <tr><td colspan="4">1st row</td></tr> 
     <tr><td colspan="2">span 1</td><td>span 2</td><td>span 3 </td></tr> 
     <tr><td colspan="4">3rd row</td></tr> 
     <tr><td>span</td><td colspan="3">other span</td></tr> 
    </tbody> 
</table>

如果沒有這樣的重寫，我怕你的表違反了HTML的表格模型，因爲目前還沒有細胞啓動第3列或列4或...

來源

2012-02-13 09:00:21

我的例子是實際不工作的例子。但是您的建議爲每個列添加一個標記解決了它。我添加了其中的10個，併爲每個設置了寬度= 10％。謝謝！但在你的例子中，你只添加了三個，因爲你使用colspan = 4，它不應該是其中的四個嗎？ – Nicsoft 2012-02-13 09:11:35

在我的演示中，最後一列只是它所需要的。爲了實現我認爲你的目標，你可以使用（當使用我的標記時）''。您的10列10％的方法可能不夠穩健，因爲它不能解決表模型問題。 – 2012-02-13 09:23:25

好的，我明白你爲什麼捨棄最後一個列。但是閱讀關於表模型，客戶端應該使用來決定列的數量，所以我猜這對每個列都有一個沒有錯。你能解釋一下爲什麼我的方式不如你的方式強壯嗎？也許我缺乏對錶模型的理解... – Nicsoft 2012-02-13 10:22:22

colspan確定單元格有多少個列重疊，而不是這些列的大小。使用CSS width屬性來指定事物的寬度。

來源

2012-02-13 08:17:47 Quentin

這實際上並不是我的意思，只是我的措辭可能有點不清楚。我會解決它。 – Nicsoft 2012-02-13 08:18:54

爲什麼colspan沒有按預期的方式應用

回答

相關問題