Question

我使用了Bootstrap日期时间选择器，现在我需要为bootstrap日历中的元素添加背景颜色。

我创建了这个HTML：

<tr HERE I NEED STYLE>
    <td>
        <span class="timepicker-hour" data-time-component="hours" title="Pick Hour" data-action="showHours">01</span>
    </td>
    <td class="separator">:</td>
    <td>
        <span class="timepicker-minute" data-time-component="minutes" title="Pick Minute" data-action="showMinutes">30</span>
    </td>
    <td>
        <button class="btn btn-primary disabled" data-action="togglePeriod" tabindex="-1" title="Toggle Period">PM</button>
    </td>
</tr>

是否可以通过css将背景放在第一个TR元素上？

Answer 1

希望它有效!! 使用内联样式

<tr style="background-color:blue;"><td><span class="timepicker-hour" data-time-component="hours" title="Pick Hour" data-action="showHours">01</span></td><td class="separator">:</td><td><span class="timepicker-minute" data-time-component="minutes" title="Pick Minute" data-action="showMinutes">30</span></td><td><button class="btn btn-primary disabled" data-action="togglePeriod" tabindex="-1" title="Toggle Period">PM</button></td></tr>

Answer 2

尝试使用jQuery：

For i = 1 To 10

ActiveCell.FormulaR1C1 = _
        "=VLOOKUP(THIS VALUE,'IN THIS TABLE RANGE,i,FALSE)"

Next i

Answer 3

为表格创建全局<style>。

将<tr>的样式放在那里。

<style type="text/css">
    tr {
      background-color: #ff0000;
    }
</style>

你甚至可能会变得棘手并且只将它添加到其他所有人：

<style type="text/css">
    tr:nth-child(even){
      background: #ff0000
    }
</style>

只需在动态循环之前运行此样式。

Answer 4

我不确定，但这可能会对你有所帮助。

＆＃13;

$('tr.some_class:first').css("background-color", "blue");

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr class="some_class">
    <td><span class="timepicker-hour" data-time-component="hours" title="Pick Hour" data-action="showHours">01</span>
    </td>
    <td class="separator">:</td>
    <td><span class="timepicker-minute" data-time-component="minutes" title="Pick Minute" data-action="showMinutes">30</span>
    </td>
    <td>
      <button class="btn btn-primary disabled" data-action="togglePeriod" tabindex="-1" title="Toggle Period">PM</button>
    </td>
  </tr>
  <tr class="some_class">
    <td><span class="timepicker-hour" data-time-component="hours" title="Pick Hour" data-action="showHours">01</span>
    </td>
    <td class="separator">:</td>
    <td><span class="timepicker-minute" data-time-component="minutes" title="Pick Minute" data-action="showMinutes">30</span>
    </td>
    <td>
      <button class="btn btn-primary disabled" data-action="togglePeriod" tabindex="-1" title="Toggle Period">PM</button>
    </td>
  </tr>
  <tr class="some_class">
    <td><span class="timepicker-hour" data-time-component="hours" title="Pick Hour" data-action="showHours">01</span>
    </td>
    <td class="separator">:</td>
    <td><span class="timepicker-minute" data-time-component="minutes" title="Pick Minute" data-action="showMinutes">30</span>
    </td>
    <td>
      <button class="btn btn-primary disabled" data-action="togglePeriod" tabindex="-1" title="Toggle Period">PM</button>
    </td>
  </tr>
</table>

＆＃13;

您还可以使用Math.random()

生成随机颜色

var back = [＆＃34;＃ff0000＆＃34;，＆＃34; blue＆＃34;，＆＃34; grey＆＃34;];

var rand = back [Math.floor（Math.random（）* back.length）];

$（＆＃39; tr.some_class：first＆＃39;）。css（＆＃34; background-color＆＃34;，rand）;

如何在动态创建的TR元素

4 个答案: