使用现有样式的基础
Use foundation with existing styles
我有一个现有的遗留应用程序。我们现在计划使用 Foundation 并只重写每个页面的顶部栏。但是当我将基础 css 文件包含到项目中时，由于它是 css，它会破坏所有现有的布局。
我正在考虑的一种方法是修改 foundation.css 以将自定义 class 附加到它的所有选择器：例如：
h1{}
成为
h1.customclass{}
但我觉得这可能行不通，因为 foundation js 可能会在内部添加样式。
希望能深入了解这一点。另外，对于现有样式的现有应用程序使用 zurb foundation 的问题有什么解决方案吗？
更新：
终于偶然发现了一个可行的解决方案：在基础 sass 文件集中
include-html-classes 到 false 不包括所有基础 css classes。然后它可以有选择地为你需要的组件设置为真，例如：对于 tables：
$include-html-table-classes: true;
这可以让您不破坏现有样式并有选择地使用基础。此外，mixin 可用于进一步自定义。例如：您可以创建一个自定义按钮基础 class，它是基础按钮 class 的混合，然后在您想要具有基础样式的按钮上使用您的自定义 class。这不会破坏您现有的按钮。
Foundation 一般用于项目开始时的快速原型制作，将其包含在已经成熟的项目中会引起很多麻烦。就个人而言，我会自己编写或寻找替代的独立组件：
您可以使用 CSS 预处理器使用 SASS 或使用 LESS Bootstrap 修改 Foundation 但是，如果您想使用 CSS 框架删除大多数组件，则失去了它的目的.它们包括影响 DOM 上所有元素的规范化 CSS 组件，即使这个组件没有 类 所以即使您向所有元素添加不同的 类 这也会仍然更改 CSS 的某些部分。这里最好的建议是自己编写 CSS 或只使用其他独立组件。
我有一个现有的遗留应用程序。我们现在计划使用 Foundation 并只重写每个页面的顶部栏。但是当我将基础 css 文件包含到项目中时，由于它是 css，它会破坏所有现有的布局。 我正在考虑的一种方法是修改 foundation.css 以将自定义 class 附加到它的所有选择器：例如： h1{} 成为 h1.customclass{}
但我觉得这可能行不通，因为 foundation js 可能会在内部添加样式。 希望能深入了解这一点。另外，对于现有样式的现有应用程序使用 zurb foundation 的问题有什么解决方案吗？
更新： 终于偶然发现了一个可行的解决方案：在基础 sass 文件集中 include-html-classes 到 false 不包括所有基础 css classes。然后它可以有选择地为你需要的组件设置为真，例如：对于 tables： $include-html-table-classes: true; 这可以让您不破坏现有样式并有选择地使用基础。此外，mixin 可用于进一步自定义。例如：您可以创建一个自定义按钮基础 class，它是基础按钮 class 的混合，然后在您想要具有基础样式的按钮上使用您的自定义 class。这不会破坏您现有的按钮。
Foundation 一般用于项目开始时的快速原型制作，将其包含在已经成熟的项目中会引起很多麻烦。就个人而言，我会自己编写或寻找替代的独立组件：
您可以使用 CSS 预处理器使用 SASS 或使用 LESS Bootstrap 修改 Foundation 但是，如果您想使用 CSS 框架删除大多数组件，则失去了它的目的.它们包括影响 DOM 上所有元素的规范化 CSS 组件，即使这个组件没有 类 所以即使您向所有元素添加不同的 类 这也会仍然更改 CSS 的某些部分。这里最好的建议是自己编写 CSS 或只使用其他独立组件。