Foundation 网格 - 小型设备

简介: 在Foundation框架中,针对屏幕宽度小于40.0625em的小型设备,使用.small-*类创建了一个简单的两列网格布局,列宽比为25%和75%。此布局遵循移动优先原则,在大屏设备上同样适用,确保总列数为12。例如,可使用.small-3和.small-9实现该布局。

Foundation 网格 - 小型设备
假设我们在小型设备上有一个简单的网格布局,两列,宽度比例为 25% 和 75%。

提示: 小型设备的定义是屏幕小于 40.0625em。

小型设备上我们使用 .small-* 类。

....

....

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

实例


Baidu




Baidu



尝试一下 »
Note 注意: 要保证数列加起来是 12 列!
如果需要设置 33.3%/66.6% 的比例,你可以使用 .small-4 和 .small-8:

实例



Baidu




Baidu



相关文章
|
Ubuntu Linux C语言
还在用Alpine作为你Docker的Python开发基础镜像?其实Ubuntu更好一点
一般情况下,当你想为你的Python开发环境选择一个基础镜像时,大多数人都会选择Alpine,为什么?因为它太小了,仅仅只有 5 MB 左右(对比 Ubuntu 系列镜像接近 100 MB),但事实的真相是,我们选择基础镜像并不是为了体验一下Python语法而已,在此基础上,我们需要调试和安装各种扩展,可能会安装很多三方依赖,甚至预设更多服务,在这种环境下,Alpine就并非是一个很好的选择了,本次我们就来分别在Alpine和Ubuntu上来体验一下安装和编译Python的区别。
还在用Alpine作为你Docker的Python开发基础镜像?其实Ubuntu更好一点
|
18天前
|
人工智能 Kubernetes Cloud Native
Higress(云原生AI网关) 架构学习指南
Higress 架构学习指南 🚀写在前面: 嘿,欢迎你来到 Higress 的学习之旅!
227 0
|
11月前
|
存储 Go PHP
Go语言中的加解密利器:go-crypto库全解析
在软件开发中,数据安全和隐私保护至关重要。`go-crypto` 是一个专为 Golang 设计的加密解密工具库,支持 AES 和 RSA 等加密算法,帮助开发者轻松实现数据的加密和解密,保障数据传输和存储的安全性。本文将详细介绍 `go-crypto` 的安装、特性及应用实例。
549 0
|
9月前
|
编译器 Android开发 开发者
Android经典面试题之Kotlin中Lambda表达式和匿名函数的区别
Lambda表达式和匿名函数都是Kotlin中强大的特性,帮助开发者编写简洁而高效的代码。理解它们的区别和适用场景,有助于选择最合适的方式来解决问题。希望本文的详细讲解和示例能够帮助你在Kotlin开发中更好地运用这些特性。
186 9
|
9月前
|
人工智能 算法 搜索推荐
算法备案全流程攻略:保姆级教程
在AI热潮下,算法成为互联网服务的核心驱动力,但也带来了大数据杀熟、算法歧视等问题。为规范行业发展,算法备案制度应运而生。该制度涵盖网站、APP等多种产品形式,要求企业在2个月内完成备案,依据《互联网信息服务算法推荐管理规定》等法规。未备案企业可能面临无法上线、罚款甚至刑罚的后果。备案流程包括注册、主体备案、信息填报及审核,确保算法合规运营。通过悬挂备案号、标识AI生成内容和定期自查,企业需持续维护算法安全与合规。
|
10月前
|
人工智能 搜索推荐 算法
婚恋交友系统UI/UX设计优化 婚恋交友系统用户界面友好性提升 婚恋交友系统用户行为分析与优化 婚恋交友系统用户反馈收集与处理
针对婚恋交友系统的UI/UX设计优化,本文提出多项策略:简化用户界面、提升交互体验、个性化推荐算法;增强用户界面友好性,包括适应性、无障碍及情感化设计;通过数据收集与分析优化用户行为路径;建立多渠道反馈机制,分类处理并及时告知结果。这些措施旨在提高用户体验和满意度,促进平台健康发展。[点击查看完整演示和免费源码](https://gitee.com/duoke-official-open-source/hunlianjiaoyou)
438 6
JVM进阶调优系列(5)CMS回收器通俗演义一文讲透FullGC
本文介绍了JVM中CMS垃圾回收器对Full GC的优化,包括Stop the world的影响、Full GC触发条件、GC过程的四个阶段(初始标记、并发标记、重新标记、并发清理)及并发清理期间的Concurrent mode failure处理,并简述了GC roots的概念及其在GC中的作用。
|
搜索推荐 前端开发 数据安全/隐私保护
改善用户体验方法
【10月更文挑战第9天】改善用户体验方法
1100 3
|
存储 人工智能 供应链
AI与能源系统:优化能源生产和消费
【10月更文挑战第9天】在当前全球能源转型的关键时期,人工智能(AI)正逐渐成为推动能源系统优化与升级的重要力量。本文探讨了AI在能源生产、分配、存储和消费等方面的应用。在能源生产中,AI通过智能预测与调度、故障预警及优化资源配置等方式提升效率;在能源分配与存储方面,AI推动智能电网管理和储能系统优化;在能源消费端,AI实现精细化管理,如智能家庭能源管理和工业节能。未来,AI将进一步融入能源系统的各个环节,促进能源的高效配置与可持续发展。然而,面对数据安全和算法透明度等挑战,需加强监管与伦理审查,确保AI技术健康发展。
数据结构中的 线性结构和非线性结构
这篇文章介绍了数据结构中的线性结构和非线性结构,其中线性结构包括顺序存储结构和链式存储结构,如数组、队列、链表和栈;非线性结构包括图结构、树结构、二维数组、广义表和多维数组。