Как изменить стиль для заголовка wenzhixin bootstrap-table?

Question

Я пытаюсь изменить стиль заголовка таблицы с помощью wenzhixin bootstrap-table. Но class = "info" не работает. есть код:

<table data-toggle="table" data-height="700" data-classes="table table-striped table-bordered table-hover"> 
 
    <thead> 
 
     <tr class="info"> <!--it doesn't work--> 
 
      <th>Item ID</th> 
 
      <th>Item Name</th> 
 
      <th>Item Price</th> 
 
     </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr> 
 
      <th>0</th> 
 
      <th>Item 0</th> 
 
      <th>10</th> 
 
     </tr> 
 
    </tbody> 
 
</table>

Пожалуйста, помогите. Как изменить стиль для начальной таблицы заголовков?

P.S. если использовать самозагрузки без wenzhixin бутстраповского стола, то все работает, но мне нужен wenzhixin Bootstrap стол

Answer 1

Вместо атрибута data-classes, если вы используете только class, проблема решается на FireFox, хром и IE7 +.

С уважением, надеемся, что он решает вашу проблему.

Answer 2

Проверить с:

<style> 
     #tableID thead tr{ 
      background-color: #0361cc; color:white; 
     } 
</style> 

Answer 3

Я была такая же проблема. bootstrap-table удаляет классы и стили из thead, tr, th теги. Это более чем неприятно, если вы также используете stickyTableHeaders (фон не будет белым, но прозрачным). bootstrap-table содержит событие load-success, которое запускается после отображения таблицы. Вы можете использовать это, чтобы впоследствии прикрепить класс/стиль к своей таблице. Имейте в виду, что ваша таблица нуждается в id

$('#myTable').on('load-success.bs.table', function (e, data) { 
    $('#myTable').stickyTableHeaders(); 
    $('#myTable thead tr').css('background','white'); 
}); 

Итак, чтобы завершить надрез, что-то, как это должно работать:

<table id="myTable" data-toggle="table" data-height="700" data-classes="table table-striped table-bordered table-hover"> 
    <thead> 
     <tr class="info"> <!--it doesn't work--> 
      <th>Item ID</th> 
      <th>Item Name</th> 
      <th>Item Price</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <th>0</th> 
      <th>Item 0</th> 
      <th>10</th> 
     </tr> 
    </tbody> 
</table> 
<script> 
    $('#myTable').on('load-success.bs.table', function (e, data) { 
     $('#myTable thead tr').css('background','pink'); 
    }); 
</script>