CSS 文章
-
用于 UI 布局的 CSS 网格
在这篇文章中,我将向您展示如何使用 CSS 网格来改进应用程序布局,这些布局需要响应和适应用户交互和不断变化的条件,并始终确保您的面板滚动正常。
-
MDN 上新的 flexbox 指南
借助 Flexbox 和 Grid,以及相关的 Box Alignment 和 Writing Modes 规范,我们拥有了用于网络的新布局模型,这些模型旨在实现我们需要创建的布局类型。无论您是想实现更具创意的设计,还是仅仅为了简化复杂用户界面的开发,Rachel Andrews 细致入微的资料都将帮助您深入了解 Flexbox 和 Grid 协同工作的力量。
-
CSS 网格布局简介:第 1 部分
CSS 网格布局彻底改变了网页设计的游戏规则。它使我们能够使用简单的 CSS 在网络上创建复杂的布局。本 2 部分入门指南的第 1 部分介绍了 CSS 网格的词汇表和新的 Firefox DevTools Playground,并向您展示了如何开始编码。
-
CSS 网格布局简介:第 2 部分
在本 2 部分介绍的第 2 部分中,Dan Brown 将引导您完成创建相同布局的三种不同方法,并指引您前往 Firefox DevTools Playground 以继续学习和探索。
-
快速 CSS 引擎内部:Quantum CSS(又名 Stylo)
Project Quantum 是对 Firefox 内部结构的重大重写,旨在使 Firefox 更快。我们正在从我们的实验浏览器 Servo 中替换部分内容,并对引擎的其他部分进行重大改进。来自 Servo 的第一个主要组件(一个名为 Quantum CSS 的新 CSS 引擎,之前称为 Stylo)现在可以在我们的 Nightly 版本中进行测试。它将来自四个不同浏览器的最新创新融合在一起,以创建一个新的超级 CSS 引擎。
-
2017 年 7 月,探索 CSS 网格检查器的最新功能
我们在一年前就开始着手开发一个开发者工具,以帮助理解和使用 CSS 网格。3 月份,我们在 Firefox DevTools 中与 CSS 网格一起发布了 Grid Inspector 的第一个版本。现在,重要的新功能正在登陆 Firefox Nightly。以下是 7 月份发布的功能概述 […]
-
Firefox Nightly 中 CSS 网格检查器中的强大新增功能
CSS 网格正在彻底改变网页设计。它是一个灵活、简单的设计标准,可以在所有浏览器和设备上使用。因此,我们创建了 CSS 网格检查器。我们一直在努力改进 Firefox 开发者工具的布局面板,向网格检查器和盒子模型添加强大的新功能。最新的增强功能现在可以在 Firefox Nightly 中使用。
-
裁剪和遮罩中的形状 - 以及如何使用它们
Firefox 54 的正式发布即将到来,它将为已经很酷的 CSS 属性引入新功能:clip-path,该属性使我们能够裁剪(即剪除)元素的一部分。使用 Firefox 54,您将能够使用 CSS 形状,例如内边距、圆形、椭圆形和多边形。在这篇包含大量演示的博文中,我们将探讨裁剪和遮罩的功能以及它们的使用方式。
-
用 CSS 网格替换 Bootstrap 布局
3 月份,Mozilla 发布了 Firefox 52,该版本添加了对 CSS 网格布局的支持。如果您不熟悉 CSS 网格,它是一种用于网络的二维布局系统,允许我们以浏览器本机方式创建布局模式。这意味着我们可以轻松地使用几行 CSS 重现熟悉的网格。[…]
-
mozilla.org 上一个新的 CSS 网格演示
随着 CSS 网格在这个春天在各个浏览器中发布(Firefox 52 和 Chrome 57 中已经可以使用;Safari 和 Edge 即将推出),Mozilla 的一些内部设计师和开发者决定在 mozilla.org 上尝试使用这项技术。结果是一个展示 CSS 网格功能并提供指向我们最喜欢的资源的链接的实时演示站点。