如何用不同的单元格创建自定义表?

时间:2018-09-08 18:54:54

标签: html css html5 html-table css-tables

应该像

enter image description here

应为4行3列。在第一列中,中央单元占用2个单元。第二秒应该是1行。第三和第一

我有这个代码

$chartCategories = app()->chartjs
                  ->name('chartCategories')
                  ->type('pie')
                  ->size(['width' => 400, 'height' => 200])
                  ->labels(['Label x', 'Label y'])
                  ->datasets([
                      [
                          'backgroundColor' => ['#FF6384', '#36A2EB'],
                          'hoverBackgroundColor' => ['#FF6384', '#36A2EB'],
                          'data' => [69, 59]
                      ]
                  ])
                  ->options([]);


          $view = View::make('partials.CPM.expensereportgraphs', [
                'chartCategories' => $chartCategories,
            ]);

但是看起来像这样 enter image description here

2 个答案:

答案 0 :(得分:0)

我不是100%知道您想要什么,这是否能满足您的需求?

<table border="1" width="100%">
    <thead></thead>
    <tbody>
    <tr>
        <td>1</td>
        <td rowspan="4">2</td>
        <td>3</td>
    </tr>
    <tr>
        <td style="height:200px;" rowspawn="2">4</td>
        <td rowspawn="2">5</td>
    </tr>
    <tr>
        <td>6</td>
        <td>7</td>
    </tr>
    </tbody>
</table>

<table border="1" width="100%"> <thead></thead> <tbody> <tr> <td>1</td> <td rowspan="4">2</td> <td>3</td> </tr> <tr> <td style="height:200px;" rowspawn="2">4</td> <td rowspawn="2">5</td> </tr> <tr> <td>6</td> <td>7</td> </tr> </tbody> </table>

答案 1 :(得分:0)

<table height="200px" width="900px" border="1px solid black">

<tr>

<td></td>
<td rowspan="4"></td>
<td></td>

</tr>

<tr>
<td rowspan="2"></td>
<td rowspan="2"></td>
</tr>

<tr>

</tr>

<tr>

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

</tr>

</table>

尝试此代码。可以。