html表colspan不按預期方式工作

這是我在html表中使用colspan的代碼，並沒有像我期望的那樣。

<table border="1"> 
    <tr> 
     <td colspan="3">a</td> 
    </tr> 
    <tr> 
     <td colspan="2">b</td> 
     <td>c</td> 
    </tr> 
</table>

我要的是：電池 'a'應該3格寬，電池 'b'應該2單元寬，電池 'c'應該1細胞寬度。

它在做什麼是：電池 'a'是2細胞寬，細胞'B' & 'C'是1細胞寬。

任何建議謝謝。

來源

2017-02-13 Sushil Kumar Jain

這是很好的只是你不能看到3單元格，因爲你有最多2單元... HTTPS：//jsfiddle.net/za3uybnr/2/ – Alexis

是同一行中的所有a，b，c嗎？ – affaz

否@affaz， a在第一行，b＆c在第二行。 –

屬性colspan確定一個單元格與其他單元格重疊的列數，而不是這些列的絕對大小。在你的情況下，跨度2有兩個跨度。你怎麼能說它不是？不要用單元格的寬度來判斷它。跨度不是寬度。您必須添加另一個較小的列到出現它作爲兩個跨度的列。

在代碼片段的最後一個示例中查看您的期望解決方案。

<h3>Example 1</h3> 
 

 
<table border="1"> 
 
    <tr><td>col1</td><td>col2</td><td>col3</td></tr> 
 
    <tr><td colspan="3">a</td></tr> 
 
    <tr><td colspan="2">b</td><td colspan="1">c</td></tr> 
 
</table> 
 

 
<h3>Example 2</h3> 
 

 
<table border="1"> 
 
    <tr><td width="80px">wide col1</td><td>col2</td><td>col3</td></tr> 
 
    <tr><td colspan="3">span 3</td></tr> 
 
    <tr><td colspan="2">span 2</td><td colspan="1">span 1</td></tr> 
 
</table> 
 

 
<h3>Your case</h3> 
 

 
<table border="1"> 
 
    <tr><td colspan="3">span 3</td></tr> 
 
    <tr><td colspan="2" width="66%">span 2</td><td width="33%">span 1</td></tr> 
 
</table>

來源

2017-02-13 08:18:50 TRiNE

感謝您的回答，我看到您的答案和示例，但首先，我不能使用示例1和2和我沒有提到的問題，我動態創建這些表，並且有許多單元格b＆ c，因此計算寬度可能很困難。但我不認爲有任何其他解決方案。我應該繼續計算每個單元格的寬度嗎？你建議什麼？ –

<table border="1"> 
 
    <tr> 
 
     <td colspan="3" width="200px">a</td> 
 
    </tr> 
 
    <tr> 
 
     <td colspan="2" width="100px">b</td> 
 
     <td width="100px">c</td> 
 
    </tr> 
 
</table>

來源

2017-02-13 08:50:37

請設置Td寬度也 –

任何其他方法？爲這麼多的單元格設置寬度可能是單調乏味的，即使一點也不響應。我有大表，不同colspan和rowspan。 –

是的你可以使用普通的css表格來發送css .. –

html表colspan不按預期方式工作

回答

相關問題