6

私がやろうとしていることのこのスキーマは、質問自体よりもわかりやすいと思います。

+------------------------+-----------------------+
|                        |                       |
+                        +-----------------------+
|                        |                       |
+------------------------+                       +
|                        |                       |
+                        +-----------------------+
|                        |                       |
+------------------------+-----------------------+
|                        |                       |
+------------------------+-----------------------+

ご覧のとおり、2 列のテーブルを作成しようとしています。このテーブルでは、ある時点で列の 1 つにまたがり、最終的には次の 2 行にわたってもう 1 つの列にまたがることができます。

それを行う明白な方法、または高度なテーブルタグ/属性が欠けていますか? それとも、テーブルを使用してそれを行う方法はありませんか?

他の方法でそれを達成できることは承知していますが、私が興味を持っているのはテーブルであり、問​​題は何ですか。

参考までに：私が試して成功しなかったことがいくつかあります http://jsfiddle.net/dbtYk/

4

2 に答える 2

6

私が何かを見逃していない限り、これはあなたのjsfiddleに基づく例です

<table>
    <tr style="height:20px;">
        <td rowspan="2">left</td>   
        <td>right</td>
    </tr>
    <tr style="height:20px;">
        <td rowspan="2">right</td>   
    </tr>
    <tr style="height:20px;">
        <td rowspan="2">left</td>   
    </tr>
    <tr style="height:20px;">
        <td>right</td>   
    </tr>
    <tr>
        <td>left</td>   
        <td>right</td>   
    </tr>
</table>

アップデート

Cicada が指摘したように、残念ながら上記は Chrome では機能しません。

更新 2

Alohci が指摘したように、高さを追加すると Chrome で機能します。上記は、新しい jsfiddleとともに、それを反映するために修正されました。

于 2012-06-11T11:58:51.003 に答える
0

もちろんそれは可能です:-)

<table border="yes">
    <tr>
        <td rowspan="2">1</td>
        <td>2</td>
    </tr>
    <tr>
        <td rowspan="2">3</td>
    </tr>
    <tr>
        <td rowspan="2">4</td>
    </tr>
    <tr>
        <td>5</td>
    </tr>
    <tr>
        <td>6</td>
        <td>7</td>
    </tr>
</table>

前の行のスパンされたセルによって既にカバーされているセルをスキップするだけです。

于 2012-06-11T12:00:57.277 に答える