15、Zurb Foundation在网页开发中的应用与实践

Zurb Foundation在网页开发中的应用与实践

1. 资产清单文件指令

在网页开发中，我们会遇到一些特殊的指令来管理CSS文件。例如，在文件顶部的注释中， *= require_self 指令表明文件中的任何CSS都应传递给浏览器。而 *= require_tree . 指令（注意这里的Unix “点运算符”）则意味着同一文件夹中的所有文件，包括子文件夹中的文件，都应合并为一个文件传递给浏览器。

对于大型复杂的网站，我们可以移除 *= require_tree . 指令，并指定要包含在资产管道生成文件中的单个文件，这样可以减少传递给浏览器的全局CSS文件的大小。比如，我们可以将仅用于网站管理部分的CSS分离到一个单独的文件中。不过，通常只有大型复杂的网站才需要这种优化，因为渲染单个大型CSS文件的速度比获取多个文件要快。

2. Zurb Foundation的JavaScript集成

Zurb Foundation提供了CSS和JavaScript库。 application.js 文件就像 application.css.scss 文件一样，是一个清单文件，允许开发者指定要合并并传递给浏览器的JavaScript文件。

rails_layout 宝石修改了 app/assets/javascripts/application.js 文件，以包含Foundation JavaScript库，代码如下：