Question

我将表格定义为：

<table role="grid" style="height: auto;"><colgroup><col style="width:200px">

<tr data-uid="5b6a6a00-3dc5-44bd-b2a4-f7a04879385c" role="row" style="outline: 1px solid rgba(0, 0, 0, 0.15);">
<td role="gridcell"><span>795368339</span><span class="NoType" begin="338" end="348"> AMANULLAH</span><span class="PhoneNumber" begin="329" end="338" style="background-color: rgb(144, 238, 144);" data-original-title=""></span>
</td>
</tr>
</tbody>
</table>

小提琴在http://jsfiddle.net/m7JLJ/

我需要在单元格中显示名称或电话号码上方的一些数据。它必须切换。

如何使用CSS进行操作？

我可以使用jQuery切换它，但是我很难在数据上方显示数据。在单元格中

Answer 1

在td（数据持有者单元格）aplly'position：relative;' 在span的（数据本身）aplly'position：absolute;'

现在它们彼此重叠，你可以通过jquery在它们之间切换。

但是现在，td高度将为0，所以我的建议是在数据之前添加一个空的span，如下所示;

<强> HTML：

<td class="Holder">
    <span class="Filler"></span>
    <span class="Phone">01234567</span>
    <span class="OtherData">my name is</span>
</td>

<强> CSS

.Holder
{
    position: relative;
}
.Phone, .OtherData
{
    position: absolute;
}
.Filler
{
    height: 100%;
    display: inline-block;
}

在单元格中显示数据以上的数据

1 个答案: