Question

我有一张桌子。有些td有palin文本，有些td有div文本。

<table class="k-selectable" role="grid" data-role="selectable">
    <tbody>
        <tr class="k-state-selected" role="row" aria-selected="true">
            <td class="center" role="gridcell">
            </td>
            <td class="center" role="gridcell">
                <div class="rc-sprite-td sprite-null">
                    &nbsp;</div>
            </td>
            <td role="gridcell">
                <div class="wb-ro-changed">
                    24261&nbsp;<span><img src="/RepairCenterWeb/Whiteboard/GetImage?IsOnHold=false&amp;IsVoid=false"></span></div>
            </td>
            <td role="gridcell">
                Issue 11
            </td>
            <td class="money" role="gridcell">
                <span class="float-left rc-sprite-td sprite-null">&nbsp;</span>$1,186.55
            </td>
            <td role="gridcell">
                <div class="wb-arrival-overdue">
                    10/9/2013</div>
            </td>
            <td role="gridcell">
                <div class="wb-delivery-overdue">
                    10/9/2013</div>
            </td>
            <td role="gridcell">
            </td>
            <td role="gridcell">
            </td>
            <td class="center" role="gridcell">
                <div class="rc-sprite-td sprite-null">
                    &nbsp;</div>
            </td>
            <td class="center" role="gridcell">
                <img src="/RepairCenterWeb/Whiteboard/GetImage?IsClosed=false&amp;HasPpi=false&amp;IsPpiVeto=false&amp;IsPartsDeleted=false&amp;HasPartsSupplement=false&amp;HasLaborSupplement=false">
            </td>
            <td class="center" role="gridcell">
                <img src="/RepairCenterWeb/Whiteboard/GetImage?HasSublet=false&amp;SubletStatus=0&amp;HasCriticalNote=false">
            </td>
            <td class="center" role="gridcell">
                <div class="rc-sprite-td sprite-null">
                    &nbsp;</div>
            </td>
            <td role="gridcell">
                <div class="center no">
                    No</div>
            </td>
            <td role="gridcell">
                <div class="center ">
                </div>
            </td>
            <td role="gridcell">
                <div class="center ">
                </div>
            </td>
            <td role="gridcell">
                <div class="center no">
                    No</div>
            </td>
            <td role="gridcell">
                <div class="center ">
                </div>
            </td>
            <td role="gridcell">
                s s
            </td>
        </tr>
    </tbody>
</table>

CSS就是

.k-state-selected:hover {
  color: #ffffff;
  background-color: #0992eb;
  border-color: #0992eb;
}
.k-state-selected td div{color: #ffffff;}

当我选择任何一行时，它会显示蓝色背景和白色文字。我的问题是它在div文本内部和内部的纯文本工作正常。任何人都可以在span，label等内添加文本。所以在这种情况下我必须添加以下

 .k-state-selected td label{color: #ffffff;}
 .k-state-selected td span{color: #ffffff;}

有什么方法可以在td内的html控件中应用css进行测试。

Answer 1

您可以使用“any element”选择器*：

.k-state-selected td * {color: #ffffff;}

仅当td具有（至少）一个元素作为子元素时才会匹配。

如何在任何html控件或没有任何html控件的文本中应用css

1 个答案: