1

在编写了我自己的响应式设计的许多项目之后，我有点厌倦了，在研究了流行的响应式框架后，我决定与 Zurb Foundation 合作。

首先我去准备好下载的css。然后我尝试使用 GEM，但我在尝试自己解决问题时遇到了一些阻力。似乎文档没有解释足够的场景，它们只是原始文档。

首先，我想念的是搜索所有类以快速找到解释，就像 jquery 的网站一样。

许多谷歌搜索和阅读以确定我需要在 Windows 上安装 ruby​​。然后我最终认为我的网络服务器也需要安装 ruby​​，但发现 SASS 只是一个预处理器，所以它只是帮助我编写和维护更好的代码:)

以下是我无法轻松解决的其他一些问题，而无需在 Google 上搜索每一件事：

1) 我已经配置了 Dreamweaver 来打开 .scss 文件。然后每天我都在开发，我需要打开 ruby​​-console，导航到项目目录并输入：compass watch。现在每次我保存所有修改（所以我可以在浏览器中测试），dreamweaver 会弹出消息框：“文件已在 Dreamweaver 之外修改，..你想保存..blabla” - 非常非常 enoying

2) app.scss 只包含很多 @import 语句。_settings.scss 包含我可以更改默认外观的代码（这是我使用 gem 的主要原因，因为还不是 SASS 大师）。我是否应该取消注释某些语句并将它们更改为我在 _settings.scss 中的需要，并且在我成功更新 zurb 的一天后我会丢失所有这些更改：gem update zurb-foundation？如果是这样，创建一个包含我所有覆盖的新 scss 是更好的做法吗？

3) 如何创建新的 .scss 文件，该文件应该覆盖 _settings.scss 监听的一些默认值。

4）我应该覆盖 app.css 还是 _settings.scss

5）当改变顶栏链接悬停颜色时，为什么不应用这些？例如：$topbar-link-color-hover: #fff; (_settings.scss)

6) 创建项目后，我的项目中没有 /img 或 /images 文件夹。因此，我自己创建了一个“/images”

7) 有很多最佳实践和教程的基础 4 书籍吗？？？

我很抱歉，但老实说，我似乎花了很多时间来学习 zurb 的基础知识。我在 C++ 项目方面有很多经验，就像在移动和桌面 Web 项目中一样，所以我真的不觉得自己像个新手，但这几乎就像我被迫购买支持一样

4

1 回答 1

3

首先我要说的是，如果您是框架新手，请尝试使用具有大量文档的东西，例如 Twitter-Bootstrap。但是，由于您决定使用 Foundation，这里是您问题的答案。

1) 设置 compass 以将文件写入 Dreamweaver 不监视的另一个目录。在本地开发时，使用像 Charles Proxy 这样的代理来代理文件。这将摆脱烦人的是否要保存此文件的消息。在将应用程序部署到本地以外的地方之前，将 SCSS 文件的编译作为构建过程的一部分。

2) 是的，app.scss 有所有的导入语句。如果您正在寻找原始速度，您可能想要评论其中一些，仅供参考。在覆盖方面，您可以做的一件事是使用在其他文件中提供给您的 Mixins。例如 Button.scss 有一些很棒的按钮混合，让你不仅可以创造自己的天赋，而且可以继承大部分的 Foundation Awesomeness。另一件事，如果您注意到所有变量都有一个！默认值。这意味着如果它们在其他地方声明（首先读取导入您的变量），默认值将被覆盖。

3）只需制作文件并将其添加为 _settings.scss 之前的导入

4) app.scss 对基础的所有部分都有大量的导入，有些是你最有可能使用的，有些可能不是。

5) 需要查看已编译的 CSS，尽管没有看到任何内容，但我的猜测是您错过了一个变量。

6) 创建它是因为 Compass 正在寻找它？除非您打算使用图像或创建精灵（指南针可以创建精灵，这太棒了），否则您可以在 config.rb 中评论或删除它。

7) 没见过。与 Bootstrap 相比，Foundation 目前的社区要少得多。但是，您可以通过学习 SASS 和 SCSS 来获得优势，这方面还有很多可用的东西。

于 2013-08-12T03:37:16.333 回答