Foundation Builder 为 功能强大的 Foundation 6 前端框架提供实时可视化设计环境。连同宽度滑块、自定义断点、全局内容更新、可自定义的预构建组件等进一步增强的功能，这将大大改进设计工作流程，让创意蓬勃发展。精通代码的设计师和前端开发人员将受益于直观且更快的工作流程，该工作流程允许进行更多的实验和设计迭代。这导致更短的周转时间和/或更真实、独特的网站设计。Foundation Builder 对于那些有兴趣学习 CSS 和使用 Foundation 进行设计的人来说也是一个很好的工具。可视化设计控件与实时预览相结合，提供了出色的反馈机制，有助于了解添加或更改 CSS 代码的效果。

Foundation 6的所有功能。无需编码。前端框架提供了一个可靠的网格系统和一个经过良好测试的预定义样式库。javascript模块允许创建交互式网站组件，例如下拉菜单和响应式导航模式。

自定义预建组件

从导航菜单、手风琴、酷标签面板、模态对话框、下拉菜单等等中进行选择。

创建您自己的交互式组件

可视化组合HTML元素、(预定义和自定义)cSs。然后混合交互式脚本来创建屏幕外导航、弹性卡片、信息弹出

窗口或画廊。真的，您可以建造的东西没有限制!

链接元素或整个组件

符号表示链接的元素或元素组。对符号项的更改将全局更新该符号的所有实例。文本、图像等内容，甚至导航菜单

等组件结构,都只需要更新一次。

无限的灵活性

使用预览功能轻松浏览符号，并通过单击按钮导航到特定实例。如果需要符号的变体，只需取消链接一个实例，它

将不再受全局更新的影响。

它是最小的和模块化的

组合元素、创建样式并添加脚本。这就像玩技术乐高(而不是得宝。)

有切换器

这真的很震撼!通过换出类别或显示隐藏的项目来创建所有类型的交互式元素。

包括运动用户界面

该库通过使用简单的数据属性帮助创建灵活的UI转换和动画。

战平相同。友阵。设计创息。

为什么这么多响应式网站看起来如此相似?手动编码时，在移动优先的工作流程中重构布局和预定义的断点可能会很痛苦。Foundation Framer具有用于视觉创建独特设计的所有控件，从xS到xxXL屏幕!不必担心代码可以

进行更多实验并激发创造力。时髦的界面和直观的风格控制保证了世界上独一无二的设计。

灵活性和使用真实内容进行设计的案例。

当我们设计响应式应用程序的功能时，我们专注于与设备无关的设计的核心:具有完全适应性布局的自定义断点。

毕竟，幻想只能建立在坚实的基础上。好奇这是为什么?我们来看一个真实的设计案例。

默认情况下,Foundation 6带有2个断点。

这些是下图中的蓝点。现在看看布局。两列设计在当前宽度下看起来不错，但在较小的屏幕上可能更喜欢单列。但

是，使用默认断点，它需要是其中之一;对于小于640px的每个屏幕，可以是单列或两列。

单击添加断点。

能够轻松添加自定义断点以调整布局，同时处理真实内容，从而带来更大的灵活性和更好的设计决策。在这种情况下，添加了一个自定义断点(白点)﹐将布局从单列更改为450像素处的两列结构。不同的间距通常会导致字体大

小发生变化;这个和其他设计更改也可以在断点处应用。

专为超大型设备而设计,没有痛苦。

在为(非常)大的屏幕设计时，可以做出类似的情况。拉起两列并创建一个六列的行怎么样?使用FoundationFramer，设计师现在可以用有限的努力做出决定。最终，这将在所有设备上创造更好的用户体验。在您需要的时间和地点设置断点。从示例中可以看出，没有布局和内容的定义断点是没有意义的。设计或布局更改需要基于实际内

容以获得最佳用户体验。断点管理是创建真正与设备无关的设计的关键。

使用CSS自动设计。

只需选择选项、按下按钮和指定尺寸，即可使用cSs的全部布局功能。不仅要有想象力，还要有创意!

使用Р和性能

拯救移动观众下载沉重、加载缓慢的图像文件。使用Picture元素，您可以为每个查看者提供敏

至高无上的定位控制

将内容放在您想要的位置。选择您的显示、绝对定位、设置为清除或浮动，或通过使用令人难以置信的可视化

Flexbox控件来简化您的生活。

多种后台功能

不要将自己局限于单―背景。层叠多个背景以获得额外的维度以获得真正身临其境的外观。

调色板管理

使用精确的选择器从屏幕上的任何位置抓取颜色。通过将它们保存到您的调色板来保持它们的组织和重复使用。

美味的排版

点击的控件使您可以轻而易举地设置和设计您的消息。它也加载了可定制的谷歌字体。使用内联编辑器，您可以

使用自己的外观个性化特殊文本。

轻松的布局管理

在"布局"窗格中单击以构建您的布局。添加、删除和合并行和列以保存内容。也可以调整跨度宽度、偏移量和推拉

设置!

手动调整也是一种选择!

oundation Framer是一个可视化应用程序，但任何想要深入了解后端的代码鉴赏家也可以选择。导出到任何代

码编辑器以手动编辑清晰明了的标记。Sweet:在自定义样式表中链接，重新导出时将会盖