Foundation 网格实例7

简介: 在宽屏设备上,.row 的最大宽度为 62.5rem,可能导致列无法完全填充页面。通过设置 .row 的 max-width 为 100%,可以解决此问题。若需背景色覆盖全页,可在容器元素上应用 .row 类并设置背景色。

宽屏
网格 (.row) 最大尺寸( max-width)为 62.5rem。在宽屏设备上尺寸可能大于 62.5rem, 这样列就无法完整填充页面,即便宽度设置为 100%。但是我们可以通过 CSS 来设置新的 max-width:

实例

尝试一下 »
如果你想使用默认的 max-width, 但是背景颜色需要跨域整个页面,这时你在容器元素上使用 .row 类,并指定你需要的背景颜色:

实例



.small-6

.small-6


相关文章
|
编解码 监控 数据可视化
一文带你快速设计精美可视化大屏
可视化大屏👉数据可视化大屏是将一些业务的关键指标通过数据可视化的方式展示到一块或多块LED大屏上,以大屏为主要展示载体的数据可视化设计。数据可视化大屏可以用于信息展示、数据分析、监控预警等多种场景,帮助用户快速了解数据的价值和意义。可视化大屏的优点1️⃣操作灵活:数据可视化大屏可以支持智能化布局和组件的自由排版,可以根据不同的需求和场景进行个性化的设计和展示。2️⃣信息展示更加全面。
一文带你快速设计精美可视化大屏
|
JavaScript 数据库
uni-app的多环境部署配置
分享下如何对uni-app项目进行多环境打包部署改造
2575 0
|
11月前
|
算法 安全 Java
自动化AutoTalk第十期:应知必会的自动化工具-阿里云SDK
本期《自动化AutoTalk》第十期聚焦应知必会的自动化工具——阿里云SDK。主要内容分为三部分:1. 阿里云SDK概述,介绍其支持的300多款云产品和8种主流编程语言;2. 快速生成SDK示例,以Java语言为例展示如何通过OpenAPI门户快速生成并下载SDK工程;3. 进阶特性介绍,涵盖签名算法、Endpoint配置、代理设置、HTTPS请求配置、超时机制及异常处理等重要功能。通过这些内容,帮助开发者更高效、安全地使用阿里云SDK。
319 3
|
消息中间件 存储 运维
|
Web App开发 缓存 文字识别
scrapy_selenium的常见问题和解决方案
scrapy_selenium是一个结合了scrapy和selenium的库,可以让我们使用selenium的webdriver来控制浏览器进行动态网页的爬取。但是在使用scrapy_selenium的过程中,我们可能会遇到一些问题,比如如何设置代理、如何处理反爬、如何优化性能等。本文将介绍一些scrapy_selenium的常见问题和解决方案,希望对你有所帮助。
631 0
scrapy_selenium的常见问题和解决方案
|
人工智能 安全 网络安全
OpenAI:启用多重身份验证功能MFA
【2月更文挑战第22天】OpenAI:启用多重身份验证功能MFA
503 1
OpenAI:启用多重身份验证功能MFA
|
SQL 分布式计算 DataWorks
DataWorks操作报错合集之在运行数据分析任务时,底层依赖服务alisa.olap.submitjob出现了异常,如何解决
DataWorks是阿里云提供的一站式大数据开发与治理平台,支持数据集成、数据开发、数据服务、数据质量管理、数据安全管理等全流程数据处理。在使用DataWorks过程中,可能会遇到各种操作报错。以下是一些常见的报错情况及其可能的原因和解决方法。
|
Java API Android开发
Java通过JNI调用C++的DLL库
Java通过JNI调用C++的DLL库
204 0
|
移动开发 小程序 JavaScript
【经验分享】记一次支付宝小程序的性能优化
【经验分享】记一次支付宝小程序的性能优化
527 7
|
安全 数据可视化 数据挖掘
数据分析能力获认可,Quick BI通过中国信通院测评
数据分析能力获认可,Quick BI通过中国信通院测评
548 0