Question

如何从Zurb Foundation中的按钮中删除背景颜色？

<button class="button button-arrow">Button <i class="icon-arrow-right">&rarr;</i></button>

CSS / LESS：

.button-arrow {
    background-color: none;
    color: black;
    font-size: @text-font-size;
    text-decoration: underline;
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;

    &:hover {
        background-color: none;
        color: @colour-dark;
    }
}

显然不起作用。有什么想法吗？

Answer 1

将其更改为：初始，这是background-color属性的默认值

Answer 2

您需要更新.button类：

.button {
   background-color: transparent;
}

确保在加载基础样式后加载的样式表中包含基础覆盖，以便您可以使用特异性覆盖它们。

The Foundation docs also talk about using SASS to edit the default variables controlling button styles：

可以使用这些来自定义此组件的默认样式   在项目的设置文件中使用Sass变量。

$按钮背景

Zurb基础 - 从按钮中删除背景颜色？

2 个答案: