Question

我有一个div，我填充了div的列表/行现在我需要为行提供替代颜色。因为我正在做以下

$('#PlatformErrorsTableData').html(table1Html);
$('#PlatformErrorsTableData div:nth-child(even)').css("background-color", "aqua");

table1Html如下所示：

<div>
  <span class="platformTable columnWidth10">Originator1</span>
  <span class="platformTable truncate">Message for Originator# 1</span>
  <span class="platformTable columnWidth15">Server1</span>
  <span class="platformTable columnWidth20">5:50 PM</span>
</div>
<div>
  <span class="platformTable columnWidth10">Originator2</span>
  <span class="platformTable truncate">Message for Originator# 2</span>
  <span class="platformTable columnWidth15">Server2</span>
  <span class="platformTable columnWidth20">5:50 PM</span>
</div> 
<div>
  <span class="platformTable columnWidth10">Originator3</span>
  <span class="platformTable truncate">Message for Originator# 3</span>
  <span class="platformTable columnWidth15">Server3</span>
  <span class="platformTable columnWidth20">5:50 PM</span>
</div>
<div>
  <span class="platformTable columnWidth10">Originator4</span>
  <span class="platformTable truncate">Message for Originator# 4</span>
  <span class="platformTable columnWidth15">Server4</span>
  <span class="platformTable columnWidth20">5:50 PM</span>
</div>

现在的问题是屏幕上没有显示颜色aqua，但是如果我在firebug中检查div，它会将背景颜色设置为aqua。

非常感谢任何帮助。

Answer 1

您使用css代码而不是jquery

#PlatformErrorsTableData div:nth-child(2n){
   background:#a5a5a5;
}

#PlatformErrorsTableData div:nth-child(2n+1){
   background:#eee;
}

Answer 2

你的代码在这里工作正常

Live Demo

我认为您的css样式设置

存在问题

overflow:hidden

并向您的div提供min-height

可能会帮助你

Answer 3

尝试在div上设置显式高度以开始。如果可行，那么您很可能遇到CSS问题，并且可能需要overflow: hidden;之类的内容（删除高度后）。还要确保span具有透明背景。

div问题的奇数偶数选择器

3 个答案: