Bootstrap面板 - 主溢出-x滾動背景顏色

這是引導面板上的css問題。如果你在下面打開我的jsfiddle並調整顯示器，使overflow-x被激活，你會看到引導面板的藍色背景顏色 - 標題轉換爲白色而不是保持藍色。當overflow-x激活時，需要保留藍色嗎？Bootstrap面板 - 主溢出-x滾動背景顏色

CSS：

.panel-primary { 
    max-width: 100%; 
    overflow-x:scroll; 
    white-space: nowrap; 
    }

HTML：

<div class="row form-group"> 
<div class="panel panel-primary"> 
<div id="hpanel" class="panel-heading">Heading</div> 
<div class="panel-body"> 
    <table id="example" class="display" cellspacing="0" width="100%"> 
    <thead> 
     <tr> 
     <th>Col1</th> 
     <th>Col2</th> 
     <th>Col3</th> 
     <th>Col4</th> 
     <th>Col5</th> 
     <th>Col6</th> 
     <th>Col7</th> 
     <th>Col8</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td>some data</td> 
     <td>some data</td> 
     <td>some data</td> 
     <td>some data</td> 
     <td>some data</td> 
     <td>some data</td> 
     <td>some data</td> 
     <td>some data</td> 

    </tr> 
    </tbody> 
    </table> 
</div> 
</div> 
</div>

JS：

$(document).ready(function() { 
var table = $('#example').DataTable({ 

    }); 
});

jsfiddle

感謝

來源

2017-04-05 lecleard

我看到了'面板heading'藍色背景，而不是'.panel-primary' –

你說得對尤里。但是，我想要在.panel-primary上滾動，因爲它會在.panel標題上設置爲奇怪。不過，我自己想出了一個解決方案，讓面板內的表反應靈敏。 – lecleard

我在回答幾個問題後回答了我自己的問題。我在桌子周圍創建了一個div。

<div class="table-responsive"> 
    <table> 
    ..... 
    </table> 
</div>

這使得響應表中的數據，而不是在面板和解決的問題，顏色可能會更好的方式去了解的東西反正。我用更新後的代碼更新了我原來的小提琴。

感謝

來源

2017-04-05 22:02:52 lecleard

Bootstrap面板 - 主溢出-x滾動背景顏色

回答

相關問題