Zurb基础表条纹造型

Question

我不想在Zurb Foundation css框架中交替行的默认条纹样式。

删除它的最简单方法是什么？

http://foundation.zurb.com/docs/components/tables.html

Answer 1

您可以使用以下方法覆盖基础表交替使用CSS规则：

table tr:nth-of-type(even) {
    background-color: transparent !important;
}

Answer 2

我查看了您提供的链接，看起来您需要做的就是在css中删除此细分：

table tr:nth-of-type(even) {
background: #f9f9f9;
}

Answer 3

或者你可以使用更多的语义路由并使用mixins。类似的东西：

$table-bg: #fff;
$table-even-row-bg: #fff;

应该工作。

Answer 4

我正在将ZURB堆栈集成到我的工作流程中，我需要一些带状表和一些非带状表。我正在使用无法在后端修改的表类，但是通过SASS，我能够删除像这样的条纹：

.table-special{
  @extend: .unstriped;
}

Answer 5

在_settings.scss中：

$table-color-scale:0% 

或

$table-is-striped: false;

Answer 6

Foundation 6.4：

  

默认情况下，表行是条带化的。有一个.unstriped类来删除条纹。如果您将$table-is-striped更改为false以从所有表中删除条带，请使用.striped类添加条带。

现在，您可以配置，或者有选择地禁用和启用表格。

对于Foundation 6的早期版本，您可能需要将以下内容添加到settings或作为最后的手段添加到主CSS文件中：

$table-striped-background: $table-background;

这假设您@import您的Foundation库，而不是将编译后的版本作为一个愚蠢的CSS文件包含在您的页面中。像Foundation这样的SCSS框架的真正优势在于它是用SCSS编写的，因此您可以在SCSS中扩展和使用它。