Foundation 网格 - 中型设备

简介: 在Foundation网格系统中,针对中型设备(屏幕尺寸40.0625em至64.0624em),推荐使用50%/50%的布局比例,并通过`.medium-*`类实现。此布局在小型设备上默认为25%/75%,而在中型设备上调整为50%/50%,确保布局适应不同屏幕尺寸。示例中展示了如何在中型设备上应用这一布局。

Foundation 网格 - 中型设备
上一章节我们介绍了小型设备上我们使用 .small-* 类来设置,网格比例为 25%/75%:

....

....

在中型设备上我们推荐的比例为 50%/50%。

提示: 中型设备的屏幕尺寸定义在 40.0625em 到 64.0624em 之间。

中型设备上使用 .medium-* 类。

现在我们在中型设备上添加两列:

....

....

以上实例设置了两个列,比例为 25% 和 75% (Foundation 是移动优先: 如果没有特别说明,在大型设备上会继承 .small 类的代码):

小型设备上使用的比例为 25%/75% (.small-3 和 .small-9)。但在中型设备上使用的比例为 50%/50% (.medium-6 和 .medium-6) 。

实例


Baidu




Baidu



尝试一下 »
Note 注意: 要保证数列加起来是 12 列!

相关文章
|
前端开发 JavaScript
使用Element-UI中的el-upload实现文件的上传demo(亲测有用)
使用Element-UI中的el-upload实现文件的上传demo(亲测有用)
uniapp manifest.json 完整参数配置参考文档
uniapp manifest.json 完整参数配置参考文档
372 0
|
算法
【MATLAB】语音信号识别与处理:一维信号NLM非局部均值滤波算法去噪及谱相减算法呈现频谱
【MATLAB】语音信号识别与处理:一维信号NLM非局部均值滤波算法去噪及谱相减算法呈现频谱
304 1
|
12月前
|
Windows
禁止ie自动跳转edge
禁止ie自动跳转edge
373 0
|
11月前
|
数据采集 人工智能 自然语言处理
关于大模型语料的迷思
随着大模型发展的不断深入,我们越来越关注到语料质量对模型能力的影响,语料中的偏差和主观性会导致生成内容不准确或带有偏见。智能引擎事业部是阿里内部深耕多年的AI工程团队,为内部业务提供了完整的大模型工程体系,持续关注大模型训推性能、成本、研发范式等关键问题。本文将基于我们的思考,探讨大模型语料的复杂性及其背后的思维过程。
|
3月前
|
API 数据安全/隐私保护 Python
小红书批量发布协议, 抖音自动批量发布软件脚本,笔记作品视频自动发布工具【python】
这个工具框架包含了小红书和抖音的批量发布功能,支持图片和视频处理、定时发布等功能
|
11月前
|
缓存 监控 数据库
接口性能飞跃:一次成功的优化实践
在软件开发中,接口性能优化是一个永恒的话题。一个高效的接口不仅能提升用户体验,还能减轻服务器压力,降低运营成本。本文将分享一次成功的接口优化案例,从问题诊断到解决方案实施,详细介绍我们的优化过程。
172 0
数据结构堆排序中堆的建立、调整、插入、删除等操作的详解(题目讲解 简单易懂)
数据结构堆排序中堆的建立、调整、插入、删除等操作的详解(题目讲解 简单易懂)
807 0
|
12月前
|
缓存 Java API
API接口性能优化管理
在数字化时代,API性能优化对于提升软件效率和用户体验至关重要。本文介绍了多种优化方法:配置优化包括调整JVM参数等;代码层面减少重复调用并批量操作数据库;池化技术如线程池和HTTP连接池能有效利用资源;数据库优化通过索引提高查询速度;异步处理则使主流程业务不受阻塞;缓存策略如Redis缓存减少数据库访问;可观测性工具如日志平台和APM帮助监控性能。综合运用这些方法,可根据业务需求持续调整优化,显著提升API性能及用户体验。
|
Linux API 调度
关于在Linux内核中使用不同延迟/休眠机制 【ChatGPT】
关于在Linux内核中使用不同延迟/休眠机制 【ChatGPT】