Foundation 中文手册 /Foundation 均衡器

Foundation 均衡器

Foundation 均衡器(Equalizer)

我们可以在容器元素添加data-equalizer属性,并为每个子元素添加data-equalizer-watch属性来创建一个相同高度的均衡器。最高的元素决定了其他元素的高度。

注意:滑块需要使用 JavaScript。所以你需要初始化 oundation JS:

实例

   Foundation 实例       

Foundation 均衡器(

相等高度容器:

php中文网 -- php中文网!!

php中文网 -- php中文网!!

我是最高的元素。其他元素使用我的搞定。

php中文网 -- php中文网!!

php中文网 -- php中文网!!

php中文网 -- php中文网!!


运行实例 »

点击 "运行实例" 按钮查看在线实例


不同屏幕的均衡器

在均衡器上通过添加data-equalizer-mq="value"属性为不同屏幕尺寸设置相同高度。值可以是以下之一:

描述 实例
medium-up 默认。创建相同高度的容器,宽度大于 40.063em
large-up 创建相同高度的容器,宽度大于 64.063em 尝试一下
xlarge-up 创建相同高度的容器,宽度大于 90.063em 尝试一下
xxlarge-up 创建相同高度的容器,宽度大于 120.063em 尝试一下

嵌套内容

data-equalizerdata-equalizer-watch属性添加相同的值。 这会一起连接到均衡器容器。 重复多次嵌套均衡器,确保他们是匹配的:

实例

   Foundation 实例       

内嵌均衡器

一个均衡容器内嵌入另一个均衡容器:

面板

内嵌面板

p>php中文网 -- php中文网!!

内嵌面板

php中文网 -- php中文网!!

内嵌面板

php中文网 -- php中文网!!

面板

php中文网 -- php中文网!!

php中文网 -- php中文网!!

面板

php中文网 -- php中文网!!


运行实例 »

点击 "运行实例" 按钮查看在线实例