自定义Foundation Grid Rows

Question

我在我的网站上使用Zurb Foundation CSS。

我需要自定义Row类的一些样式。我需要控制它的高度，因为在某些地方，两行之间的差距太大，我想减少。也有可能我可以在我需要的行上添加指针光标和一些背景颜色。

这是我初始化的方式，直到现在还没有添加任何自定义样式。

$(document).foundation();

请告诉我如何根据我的需要定制Zurb基础。

Answer 1

您可以使用这个方便的工具自定义gutter的属性：

http://foundation.zurb.com/develop/download.html#customizeFoundation

只需保存文件并将其作为基础，您就可以尽可能轻松地进行滚动。

或者，您可以自己编辑CSS，但您需要更改批次属性才能使其有效运行。

如果您只想更改一个 element，另一个选择是加载custom CSS file 后加载foundation，因为这会覆盖您可以应用于任何class的特定elements。

实施例

<link rel="stylesheet" href="css/foundation.css">
<link rel="stylesheet" href="css/style.css">

style.css：

.yourClass {
    padding: 0;
    background: #CCC;
}
.yourClass:hover {
    cursor: pointer;
}

<强> HTML：

<div class="yourClass">Content</div>

我正在建立的网站上有各种各样的自定义样式：

• http://www.sinsysonline.com/secondhomehostel