表单元显示作为使用CSS

我有一个表如下细胞表单元显示作为使用CSS

<table border="1"> 
    <tr> 
     <td style="display:table-row"> 
      Apple 
     </td> 
     <td style="display:table-row"> 
      Banana 
     </td> 
     <td style="display:table-row"> 
      Candle 
     </td> 
     <td style="display:table-row"> 
      Digital drive 
     </td> 
    </tr> 
</table>

输出如下

table cell display set to table-row

我想改变输出至显示仅在第一两列第一行然后是第二行中的最后两列，而不改变表格html的结构，但只改变显示属性。有没有任何让我实现这一目标的CSS？

来源

2014-02-21 user581157

你为什么要结构化你的html错误，用css纠正它？ –

该html是一个生成的，我需要不同的屏幕尺寸不同的显示！因此这个例子是一个通用的例子 – user581157

尝试实现这一目标显示这一点：

table td { 
    border: none; 
} 
table td:nth-child(-n+1),td:nth-last-child(-n+2) { 
    float: left; 
}

JSFiddle link

这只会令前两列和最后两列单行。

来源

2014-02-21 12:30:30

您可以使用CSS：

display: none;

来源

2014-02-21 12:18:21 Popo

起初我建议不要更改td默认行为，我们有规范每个标签遵循它。您可以使用visibility:hidden;或display:none;表行

<table border="1"> 
    <tr> 
     <td> 
      Apple 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Banana 
     </td> 
    </tr> 
    <tr> 
     <td> 
      Candle 
     </td> 
    </tr> 
    <tr>   
     <td> 
      Digital drive 
     </td> 
    </tr> 
</table>

来源

2014-02-21 12:26:05 Harish

表单元显示作为使用CSS

回答

相关问题