Question

我试图找到一种方法来编辑通过css创建的每个表。我之前使用过其他产品，就像创建的桌面印刷和＆＃34; id＆＃34;因此，当我查看Google Chrome检查器时，您可以单独访问该表 - 即tablepress-id-5

.tablepress-id-5 th {
background-color: #0e4ea0 !important;
color: #fff !important;
padding-top: 4px !important;
padding-bottom: 4px !important;}

我无法找到Ninja Tables创建的表格的任何标识符。基本上我希望以某些行和列为中心。

您可以在此处查看该页面 http://test.pegasusbus.com/orlandomagic/

所有的桌子都在手风琴里面，但这不应该影响我所能想到的任何东西。任何帮助都会很棒...谢谢你花时间去看。

Answer 1

您可以使用这样的类来设置所有表的样式，并忽略.foo-table：

table {color: red;}

换句话说，用这种方式设置所有表的样式，而不仅仅是.foo-table表。

或者，如果您只想设置.foo-tables样式，请从.foo-table类开始，然后从那里开始，请参阅我的示例。你可以使用带有id号的id，带有类号的类，或者对所有foo-table表使用.foo-table通用类，这取决于你。这个例子是你主页上第一个手风琴的第一个表：

.foo-table {
color: blue;
}

.foo-table button {
background: green;
color: white;
border: none;
padding: 1em 2em;
}

.foo-table th {
color: orange;
}

<div id="footable_parent_985" class="footable_parent wp_table_data_press_parent bootstrap3 ">
                                                <table data-footable_id="985" id="footable_985" class="foo-table ninja_footable foo_table_985 table ninjamagic table-hover ninja_no_color_table footable footable-1 footable-paging footable-paging-right breakpoint-lg" style="display: table;"><thead><tr class="footable-header"><th style="display: table-cell;" class="footable-first-visible">Opponent</th><th style="display: table-cell;">Date</th><th style="display: table-cell;">Game Tier</th><th style="display: table-cell;" class="footable-last-visible">Purchase</th></tr></thead><tfoot></tfoot><tbody><tr><td style="display: table-cell;" class="footable-first-visible">Houston Rockets</td><td style="display: table-cell;">1/3/18</td><td style="display: table-cell;">Two</td><td style="display: table-cell;" class="footable-last-visible"><button style="font-size: 10px">Buy Tickets</button></td></tr><tr><td style="display: table-cell;" class="footable-first-visible">Cleveland Cavaliers </td><td style="display: table-cell;">1/6/18</td><td style="display: table-cell;">One</td><td style="display: table-cell;" class="footable-last-visible"><button style="font-size: 10px">Buy Tickets</button></td></tr><tr><td style="display: table-cell;" class="footable-first-visible">Minnesota Timberwolves</td><td style="display: table-cell;">1/16/18</td><td style="display: table-cell;">Four</td><td style="display: table-cell;" class="footable-last-visible"><button style="font-size: 10px">Buy Tickets</button></td></tr><tr><td style="display: table-cell;" class="footable-first-visible">Sacramento Kings</td><td style="display: table-cell;">1/23/18</td><td style="display: table-cell;">Five</td><td style="display: table-cell;" class="footable-last-visible"><button style="font-size: 10px">Buy Tickets</button></td></tr><tr><td style="display: table-cell;" class="footable-first-visible">Los Angeles Lakers</td><td style="display: table-cell;">1/31/18</td><td style="display: table-cell;">Three</td><td style="display: table-cell;" class="footable-last-visible"><button style="font-size: 10px">Buy Tickets</button></td></tr></tbody></table>        </div>

Answer 2

嗨Ninja Tables作者在这里。在Ninja Tables中，每个表都具有基于表的数据库ID的唯一css id。以下是您可以用来应用特定于表的css的几个ID：

#footable_parent_{TableID}：此ID可用于表的包装器 #footable_{TableID}：此标识位于表格标记中。

您也可以通过选择css：

来选择所有忍者表

.ninja_footable：这个css类可用于使用NinjaTables插件构建的所有表。

查看忍者桌的所有功能请查看Ninja Tables

的目标网页

如果您有任何问题，可以在我们的网站上提交支持请求。我们的支持团队非常敏感且乐于助人。

Wordpress Ninja表CSS样式

2 个答案: