Question

我如何制作这样的桌子？

abc |la
sa  |___
cdef|hi

基本上是那样的边界

Answer 1

如果我理解正确，你需要一个高单元格旁边的两个小单元格。这可以使用rowspan属性来实现，如下所示：

<table>
  <tr>
    <td rowspan="2">abc sa cdef</td>
    <td>la</td>
  </tr>
  <tr>
    <td>hi</td>
  </tr>
</table>

Answer 2

快速修复如下：

HTML：

<table>
    <tr>
        <td class="left">abc</td>
        <td class="right1">la</td>
    </tr>
    <tr>
        <td class="left">sa</td>
        <td class="right2">&nbps;</td>
    </tr>
    <tr>
        <td class="left">cdef</td>
        <td class="right1">hi</td>
    </tr>
</table>

css：

td.left { border-right:1px solid black; }
td.right2 { border-bottom:1px solid black; }

Answer 3

<table>
<tr>
 <td class="border-r"> abc </td>
 <td> la </td>
</tr>
<tr>
 <td class="border-r"> sa </td>
 <td class="border-b">&nbsp;</td>
</tr>
<tr>
 <td class="border-r">cdef</td>
 <td> hi </td>
</tr>
</table>

CSS

td.border-r
{
 border-right:1px solid #000000;
}
td.border-b
{
 border-bottom:1px solid #000000;
}

Answer 4

<table>
<tr>
<td class="border-r"> abc </td>
 <td> la </td>
 </tr>
 <tr>
 <td class="border-r"> sa </td>
 <td class="border-b">&nbsp;</td>
</tr>
<tr>
<td class="border-r">cdef</td>
<td> hi </td>

在html中创建表

4 个答案: