html - 如何使用 px 回退使 Compass Vertical Rhythm 输出 Rems 而不是 Ems？

Question

我想这样做:http://www.youtube.com/watch?v=ls3Clk-kz3s但输出 rems(使用 px 回退)而不是 ems。

显然是这个https://github.com/chriseppstein/compass/pull/896已添加到 compass 并且应该可以正常工作，但我不太了解我需要什么 http://compass-style.org/reference/compass/typography/vertical_rhythm/添加到我的 .scss 文件中。

如果我只是从 https://gist.github.com/ry5n/2026666 中获取代码作为混合(即使根本没有 Compass)并使用:

@include set-font-size()

代替:

@include adjust-font-size-to()

它与 rem 值和 px 后备完美配合。

但如果我只是尝试使用 Compass 并使用

$font-unit: 1rem;
$relative-font-sizing: false;

它可以工作，但没有 px 回退。

如果有人可以将 Vertical Rhythm 所需的完整 .scss 代码与 Rems 一起使用，我将非常感激。

如果我使用 Rems，为什么我需要 $relative-font-sizing: false？ 此外，除了像这样将文本置于网格之外，是否存在一些关于垂直节奏的竞争哲学？您更喜欢哪一个？您的工作流程是什么？

非常感谢您。

Answer 1

目前，Compass 的这些更新保留在预发布的 gem 中，匹配的文档在 compass-style.org(甚至 beta.compass-style.org 上)尚不可用。要使用新功能，请安装最新的 gem (0.13.alpha.4):

gem install compass --pre

对于新的 gem，垂直节奏 API 略有不同，主要是在其可配置变量中，根据 https://github.com/chriseppstein/compass/pull/896 .简而言之，设置基本字体大小和行高，并将新的 $rhythm-unit 变量设置为 rem:

$base-font-size: 16px;
$base-line-height: 24px;
$rhythm-unit: 'rem';

$rhythm-unit 变量取代了 $font-unit，$relative-font-sizing 现在是一个私有(private)的内部变量，您无需担心。

在此之后，所有正常的垂直节奏 mixins 将输出带有后备的 rems(除非您明确将 $rem-with-px-fallback 设置为 false)。请注意，除了 rhythm mixin 之外，API 的其余部分几乎保持不变，它现在具有更合理的默认参数。 original pull request 中详细介绍了一些补充内容.

请记住，节奏函数不能提供像素回退，因为它们只是返回一个值。