Foundation 均衡器(Equalizer)2

简介: 通过在均衡器上添加 `data-equalizer-mq="value"` 属性,可为不同屏幕尺寸设置相同高度。值包括 `medium-up`(>40.063em)、`large-up`(>64.063em)、`xlarge-up`(>90.063em)和 `xxlarge-up`(>120.063em)。嵌套内容时,需为 `data-equalizer` 和 `data-equalizer-watch` 属性添加相同值以连接至均衡器容器。

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

值 描述 实例
medium-up 默认。 创建相同高度的容器,宽度大于 40.063em
large-up 创建相同高度的容器,宽度大于 64.063em 尝试一下
xlarge-up 创建相同高度的容器,宽度大于 90.063em 尝试一下
xxlarge-up 创建相同高度的容器,宽度大于 120.063em 尝试一下
嵌套内容
为 data-equalizer 和 data-equalizer-watch 属性添加相同的值。 这会一起连接到均衡器容器。 重复多次嵌套均衡器,确保他们是匹配的:

实例




Panel






Nested Panel


Lorem ipsum...




Nested Panel


Lorem ipsum...




Nested Panel


Lorem ipsum...










Panel


Ut enim...






Panel


Lorem ipsum....




相关文章
|
存储 监控 安全
资深IT告诉你为什么网络监控非常重要
因为移动设备的广泛使用、疫情带来的远程办公等工作方式的变化,企业网络安全已经由传统的内网安全转变为全方位的网络安全,其中尤其是在网络监控方面。
480 3
|
机器学习/深度学习 自然语言处理
【机器学习】如何进行中文命名实体识别?(面试回答)
中文命名实体识别的基本概念、分类、识别思想、实体标注方法以及常见的识别方法,包括基于规则、基于统计和基于深度学习的方法。
394 1
【机器学习】如何进行中文命名实体识别?(面试回答)
|
机器学习/深度学习 自然语言处理 算法
大模型技术基础
【7月更文挑战第26天】大模型技术基础
521 6
|
物联网 人机交互 语音技术
计算机中输入输出设备
【7月更文挑战第28天】
411 1
|
移动开发 运维 算法
室内电子地图制作:位构云平台,快速构建轻量级多类型地图
在数字化时代,室内导航和空间信息管理变得日益重要。位构云平台以其强大的功能和用户友好的界面,为用户提供了一个全面的解决方案,轻松构建多平台、综合型地图引擎,满足从商场到校园等各种场景的需求。
451 1
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的火车票订票系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的火车票订票系统的详细设计和实现(源码+lw+部署文档+讲解等)
303 1
|
数据挖掘 数据处理
信息系统规划方法
信息系统规划方法
859 5
微机实验一 || 流水灯实验
微机实验一 || 流水灯实验
390 0
用Python实现QQ/微信消息轰炸
用Python实现QQ/微信消息轰炸
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的无人超市管理系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的无人超市管理系统的详细设计和实现(源码+lw+部署文档+讲解等)
225 0