如何覆盖\编辑Zurb Foundation基本CSS样式？

Question

这是我第一次使用Zurb Foundation进行网络项目.但是,我不确定是否在单独的样式表中使用我自己的样式覆盖它们的样式或直接编辑foundation.css.

例如,这是他们的nav css(内部foundation.css):

.nav-bar {
    background: #4D4D4D;
    height: 40px;
    margin-left: 0;
    margin-top: 20px;
    padding: 0;
}

如果我想改变background和margin-top,我直接编辑.nav-bar从foundation.css或创建自己的样式表(把style.css以下foundation.css),并覆盖它,像这样:

.nav-bar {
    background: #999;
    margin-top: 0;
}

这是好习惯吗？如果没有,最好的方法是什么？

Answer 1

最佳做法是使用您所描述的自定义.css文件覆盖其样式表.这样,如果发布更新,例如错误修复,那么您只需替换foundation.css文件.

如果您直接编辑foundation.css文件并想要更新框架,那么您需要自己手动进行更新.

Answer 2

最佳做法是阅读Zurb Foundation网站上的文档.第二个最佳做法是在下载中打开2个文件夹:css和js.在此文件夹中,您将找到:

app.css和 app.js

这些是Zurb为您预先制作的文件,因此您可以开始重写他们的风格!

建议不要触摸foundation.js或foundation.css.您将无法升级以用于将来的选项,或者您可能会制动一些您不想制动的东西.快乐的编码!