我应该编写什么代码来将 table 的颜色更改为绿色？

Question

如何将 table 的颜色从灰色更改为黑色？我已经尝试 background-color: green 但它不会影响 table.

的标题背景

<style type="text/css">
    .table-fixed thead {
        width: 97%;
    }
    .table-fixed tbody {
        height: 230px;
        overflow-y: scroll;
        width: 100%;
    }
    .table-fixed thead, .table-fixed tbody, .table-fixed tr, .table-fixed td, .table-fixed th {
        display: block;
    }
    .table-fixed tbody td, .table-fixed thead > tr> th {
        float: left;
        border-bottom-

width: 0;
    }
</style>
<div class="container">
    <div class="row">
        <div class="panel panel-default">
            <div class="panel-heading">
                 <h4>
                     Fixed Header Scrolling Table 
                 </h4>

            </div>
            <table class="table table-fixed">
                <thead>
                    <tr>
                        <th class="col-xs-2">#</th>
                        <th class="col-xs-8">Name</th>
                        <th class="col-xs-2">Points</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="col-xs-2">1</td>
                        <td class="col-xs-8">Mike Adams</td>
                        <td class="col-xs-2">23</td>
                    </tr>
                    <tr>
                        <td class="col-xs-2">2</td>
                        <td class="col-xs-8">Holly Galivan</td>
                        <td class="col-xs-2">44</td>
                    </tr>
                    <tr>
                        <td class="col-xs-2">3</td>
                        <td class="col-xs-8">Mary Shea</td>
                        <td class="col-xs-2">86</td>
                    </tr>
                    <tr>
                        <td class="col-xs-2">4</td>
                        <td class="col-xs-8">Jim Adams</td>
                        <td class="col-xs-2">23</td>
                    </tr>
                    <tr>
                        <td class="col-xs-2">5</td>
                        <td class="col-xs-8">Henry Galivan</td>
                        <td class="col-xs-2">44</td>
                    </tr>
                    <tr>
                        <td class="col-xs-2">5</td>
                        <td class="col-xs-8">Henry Galivan</td>
                        <td class="col-xs-2">44</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>

Answer 1

仅针对 .table-fixed class 设置背景效果很好：

.table-fixed {
    background-color: green;
}

我认为如果 header 没有受到影响，您可能只是为 tbody 元素设置了它。

要设置整个面板的背景颜色，您可以尝试在面板 DIV 上设置一个新的 class，然后在 css 中设置它的颜色。

<style>
    .panel-green { background-color: green; }
</style>

<div class="panel panel-default panel-green">
    ....
</div>

或者在面板上明确设置背景：

<div class="panel panel-default" style="background-color: green">
    ....
</div>

Answer 2

您可以简单地尝试：编辑：忽略了 th 个元素

table thead th{
      background:green;
}

这里是fiddle demo

Answer 3

您可以使用

.table header{
    background-color:green;
}

Answer 4

我修改了tableheader颜色，tableheader文字颜色，table背景颜色。

我在你的 code.I 中添加了一些 css 代码评论了该代码

.table{
     background-color: green;/* done by me */
    
} 


.table-fixed thead {
        width: 97%;
    background-color: red;/* done by me */
    color: white;/* done by me */
    }
    .table-fixed thead {
        width: 97%;
    }
    .table-fixed tbody {
        height: 230px;
        overflow-y: scroll;
        width: 100%;
    }
    .table-fixed thead, .table-fixed tbody, .table-fixed tr, .table-fixed td, .table-fixed th {
       / display: block;
    }
    .table-fixed tbody td, .table-fixed thead > tr> th {
        float: left;
        border-bottom-

width: 0;
    }

<div class="container">
    <div class="row">
        <div class="panel panel-default">
            <div class="panel-heading">
                 <h4>
                     Fixed Header Scrolling Table 
                 </h4>

            </div>
            <table class="table table-fixed">
                <thead>
                    <tr>
                        <th class="col-xs-2">#</th>
                        <th class="col-xs-8">Name</th>
                        <th class="col-xs-2">Points</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="col-xs-2">1</td>
                        <td class="col-xs-8">Mike Adams</td>
                        <td class="col-xs-2">23</td>
                    </tr>
                    <tr>
                        <td class="col-xs-2">2</td>
                        <td class="col-xs-8">Holly Galivan</td>
                        <td class="col-xs-2">44</td>
                    </tr>
                    <tr>
                        <td class="col-xs-2">3</td>
                        <td class="col-xs-8">Mary Shea</td>
                        <td class="col-xs-2">86</td>
                    </tr>
                    <tr>
                        <td class="col-xs-2">4</td>
                        <td class="col-xs-8">Jim Adams</td>
                        <td class="col-xs-2">23</td>
                    </tr>
                    <tr>
                        <td class="col-xs-2">5</td>
                        <td class="col-xs-8">Henry Galivan</td>
                        <td class="col-xs-2">44</td>
                    </tr>
                    <tr>
                        <td class="col-xs-2">5</td>
                        <td class="col-xs-8">Henry Galivan</td>
                        <td class="col-xs-2">44</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>

我应该编写什么代码来将 table 的颜色更改为绿色？

What code should I write to change the color of the table to green?

html

css

header

colors