Question

我有一个表，我想使用stackable.js（http://johnpolacek.github.io/stacktable.js/）来为移动设备做出响应，我的表具有基于数据类型的特定背景颜色，所以在桌面我的表工作正常但是当缩小尺寸时，表格的背景颜色消失：

在这个例子中，当reduce减去某些行的红色背景时，如何使这个功能也在移动中。

<table id="gestione_aree" class="tabella_prezzi">
                  <tr class="etichette bitsmall">
              <th width="50%">
                  <a href="/amministra/gestione_aree/index.php?ord=denominazione&desc=0#inizio_tabella" title="Ordina per NOME">nome</a>
              </th>............... continue on codepen

http://codepen.io/anon/pen/MwvJxa

Answer 1

因此，该类将从原始表中复制并添加到stackable创建的内容中。您必须将background-color应用于CSS文件中的表格类：

.tabella_prezzi { background-color: #ff0000; }

更新了您的codepen：http://codepen.io/anon/pen/mJMWpY

Answer 2

不是将背景颜色应用于tr，而是将一个类添加到tr。

此类将添加到表small-only和large-only。

然后在css中添加背景颜色。

检查小提琴 - https://jsfiddle.net/s9tsL5yt/

添加了此示例css

.bgcolor{
    background: red !important;
}

Answer 3

我修改了javascript以将样式添加到移动表格中的tr。现在它只添加了类。

请检查小提琴 - https://jsfiddle.net/s9tsL5yt/1/

在js中添加了一个额外的类tr_style以获取样式。

stackable.js表背景颜色不起作用

3 个答案: