有沒有辦法改變react-bootstrap-table的分頁樣式？

react-bootstrap-table中分頁行的默認樣式使用引導程序網格列調整類名稱（如「col-xs-6」）。我們使用的是不同大小的網格，默認網格（60而不是12），因此分頁元素最終會擠壓到左側的小列中。有沒有辦法改變react-bootstrap-table的分頁樣式？

將類名設置爲「col-xs-30」可以解決問題。但我沒有看到調整任何分頁樣式的選項。

我看到有一種方法可以完全自定義渲染分頁元素。這是我唯一的選擇嗎？複製原始文件並只更改字號？

來源

2017-04-06 Gregory Bell

如果您看到documentation for pagination，看起來這是調整網格分頁的獨特方式。（見自定義分頁這裏部分）

說這一點，你可以隨時使用上層階級的分頁元素，即反應-BS-表分頁從這點覆蓋CSS，因此沒有勾選react-bootstrap表選項來添加你自己的類到分頁。

<div class="react-bs-table-pagination"> 
    <div class="row" style="margin-top: 15px;"> 
     <div> 
      <div class="col-md-6 col-xs-6 col-sm-6 col-lg-6"> 
       <span class="dropdown react-bs-table-sizePerPage-dropdown" style="visibility: visible;"> 

        <!-- ... --> 
        <!-- DROPDOWN CODE --> 
        <!-- ... --> 

       </span> 
      </div> 
      <div class="col-md-6 col-xs-6 col-sm-6 col-lg-6" style="display: block;"> 
       <ul class="react-bootstrap-table-page-btns-ul pagination"> 

        <!-- ... --> 
        <!-- PAGINATION ELEMENT CODE --> 
        <!-- ... --> 

       </ul> 
      </div> 
     </div> 
    </div> 
</div>

來源

2017-09-13 09:27:32 txeo

有沒有辦法改變react-bootstrap-table的分頁樣式？

回答

相關問題