0

次の形式で表を描きたい：

描きたかったテーブル

しかし、正しく表示されていません。最後の列の後にいくつかの行を挿入しています。HTMLを修正するにはどうすればよいですか？

<tr>
    <th rowspan="2">Client ID</th>
    <th rowspan="2">Trade ID</th>
    <th rowspan="2">Symbol</th>
    <th rowspan="2">Average Price</th>
    <th colspan="3">DTD</th>
    <th colspan="3">MTD</th>
    <th rowspan="2">Net YTD</th>
</tr>


<tr>
    <td><core:out value="${orderBookData.clientID}" /><br></td>
    <td><core:out value="${orderBookData.tradeID}" /></td>
    <td><core:out value="${orderBookData.symbol}" /></td>
    <td><core:out value="${orderBookData.averagePrice}" /></td>
    <td><core:out value="${orderBookData.DTD}" /></td>
    <td><core:out value="${orderBookData.MTD}" /></td>
    <td><core:out value="${orderBookData.YTD}" /></td>
    <td><core:out value="${orderBookData.DTD}" /></td>
    <td><core:out value="${orderBookData.MTD}" /></td>
    <td><core:out value="${orderBookData.YTD}" /></td>
    <td><core:out value="${orderBookData.YTD}" /></td>
</tr>
4

1 に答える 1

1

ヘッダー行は完全に正確です。<td>ただし、後続のタグで余分な行と列を考慮する必要があります。列1〜4と7はであるため、列5〜6で必要な余分なセルを考慮して、2つのタグが付いrowspan="2"た秒が必要です。さらに、列5〜6の下にそれぞれ3つのセルが必要なため、この数を3倍にする必要があります。したがって、6つが必要になります。<tr><td>

<tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
</tr>

7つの列すべてに加えて、4つの余分なセルを考慮する必要があるため、それ以降のすべての行には11<td>個のタグが必要になります。

<tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
</tr>

JSフィドル： http： //jsfiddle.net/Aj5k7/2/

rowspanおよびcolspan属性に関するチュートリアル： http ：//www.tizag.com/htmlT/tables.php/

于 2012-07-12T13:43:43.410 に答える