使用css垂直堆栈表td元素

时间:2008-12-11 19:51:43

标签: css

有没有办法垂直堆叠选定的td元素?我想拥有相同的表,但只使用css以不同的方式显示它。这是可能的,还是我必须有单独的HTML标记?我想尝试使用相同的html标记,但为不同的网站/外观使用不同的CSS。

<table>
  <tr>
     <td class="vertical" id="one" >i'm</td>
     <td class="vertical" id="two" >above</td>
     <td class="vertical" id="three" >this</td>
     <td class="horizontal" id="four" >i'm horizontal</td>
  </tr>
</table>

2 个答案:

答案 0 :(得分:6)

你也可以让它们显示:阻止,但我不太确定这会对桌面布局产生什么影响。

.vertical{
 display:block;
}

答案 1 :(得分:3)

您需要创建堆叠表

<table>
  <tr>
     <td class="vertical">i'm</td>
     <td class="horizontal" rowspan="3">i'm horizontal</td>
  </tr>
  <tr>
     <td class="vertical">above</td>
  </tr>
  <tr>
     <td class="vertical">this</td>
  </tr>
</table>

这就是表格的制作方法。 如果你想使用CSS,你必须使用DIV。

豫ICP备18024241号-1