如何将网站从 Zurb Foundation 4 迁移到 Zurb Foundation 6?
How to migrate a web site to Zurb Foundation 6 from Zurb Foundation 4?
我正在寻找一个使用 Foundation 版本 4.x 的大型项目。该项目广泛使用了网格:几乎所有 HTML 页面都有
css 类 从版本 4x 如
row, large-12 columns, panel, callout
我正在尝试找出一些基本的过渡方法?
问题:行、列和面板 类 仍然受支持吗?
如何将旧行和列转换为新网格 类 即如果我有一个
<div class="row>
<div class="large-12 columns">
Foundation 6 中的等价物是什么?
仍然支持 Flex Grid or Float Grid,但是您需要稍微不同地导入 Foundation。
要在 Foundation v6.4+ 中使用浮动网格,您需要:
在 CDN link 或包管理器中:导入 foundation-float.css
代替 foundation.css
。
在Sass中:将$xy-grid
和$global-flexbox
都设置为false
。
要在 Foundation v6.4+ 中使用 Flex Grid,您需要:
在 CDN link 或包管理器中:导入 foundation-flex.css
代替 foundation.css
。
在 Sass 中:将 $xy-grid
设置为 false
。
更新您的 HTML 以使用 XY 网格
根据你给出的例子,最直接的'conversion'是:
<div class="grid-x">
<div class="cell">
我正在寻找一个使用 Foundation 版本 4.x 的大型项目。该项目广泛使用了网格:几乎所有 HTML 页面都有
css 类 从版本 4x 如
row, large-12 columns, panel, callout
我正在尝试找出一些基本的过渡方法?
问题:行、列和面板 类 仍然受支持吗?
如何将旧行和列转换为新网格 类 即如果我有一个
<div class="row>
<div class="large-12 columns">
Foundation 6 中的等价物是什么?
仍然支持 Flex Grid or Float Grid,但是您需要稍微不同地导入 Foundation。
要在 Foundation v6.4+ 中使用浮动网格,您需要:
在 CDN link 或包管理器中:导入 foundation-float.css
代替 foundation.css
。
在Sass中:将$xy-grid
和$global-flexbox
都设置为false
。
要在 Foundation v6.4+ 中使用 Flex Grid,您需要:
在 CDN link 或包管理器中:导入 foundation-flex.css
代替 foundation.css
。
在 Sass 中:将 $xy-grid
设置为 false
。
更新您的 HTML 以使用 XY 网格
根据你给出的例子,最直接的'conversion'是:
<div class="grid-x">
<div class="cell">