blueprint-typography-body([$font-size]) 的正确用法是什么?

发布于 2024-09-01 06:43:40 字数 904 浏览 1 评论 0原文

最近转换为 RoR,我一直在使用 Compass w/ Blueprint 来深入研究众所周知的水池。 Compass 非常棒,但我在 Typography 库中发现了一些奇怪的东西。

blueprint-typography-body mixin 包含以下内容:

=blueprint-typography-body($font-size: $blueprint-font-size)
  line-height: 1.5
  +normal-text
  font-size: 100% * $font-size / 16px

我的问题围绕“字体大小”。我有点迷失了,因为我希望传递字体大小并在页面加载时反映该大小。然而,在这种情况下,公式似乎规定了相对于默认字体的百分比。

即:

+blueprint-typography-body(10px) //produces 7.5px off of the default font size of 12px from what I can tell.

本质上,我很好奇除了明确声明“font-size:10px”之外,Compass 中是否有设置字体大小的标准。

注意:我倾向于 Blueprint/Compass 字体样式的原因是行高、字体和颜色的标准化。

Recent convert to RoR and I've been using Compass w/ Blueprint to dip into the proverbial pool. Compass has been fantastic, but I've come across something strange within the Typography library.

The blueprint-typography-body mixin contains the following:

=blueprint-typography-body($font-size: $blueprint-font-size)
  line-height: 1.5
  +normal-text
  font-size: 100% * $font-size / 16px

My question revolves around "font-size." I'm a bit lost, as I would expect to pass in a font size and have that size reflected upon page load. However, in this scenario the formula seems to dictate a percentage against the default font.

ie:

+blueprint-typography-body(10px) //produces 7.5px off of the default font size of 12px from what I can tell.

In essence, I'm curious if there is a standard to setting font size within Compass other than explicitly declaring "font-size: 10px".

Note: The reason I'm leaning towards Blueprint/Compass font stylings is due to the standardization of line-heights, fonts and colors.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

执笏见 2024-09-08 06:43:40

老实说,蓝图排版的指南针端口尚未完全可配置。因此,更改默认值可能不会给您提供适当的字体节奏。

然而,susy 的下一个版本有一个完全可配置的垂直节奏模块,我帮助构建了它,它非常好。

Susy

垂直节奏模块

To be honest, the compass port of the blueprint typography is not fully configurable yet. So changing that default is probably not going to give you a proper font rhythm.

However, The next release of susy has a fully configurable vertical rhythm module that I helped build and it's pretty nice.

Susy

Vertical Rhythm Module

绳情 2024-09-08 06:43:40

只需阅读 Compass 文档 的讨论(Julio Antúnez 的评论)即可调整字体像这样的尺寸:

@import "compass/typography"

$base-font-size:   14px
$base-line-height: 21px

header h1
  +adjust-font-size-to(18px)

不确定这是推荐的方式,但它对我有用。我刚刚开始使用指南针和指南针。上面的蓝图可能会在其他地方引起问题。

Just read in the discussion on Compass documentation (Julio Antúnez's comment) that you can adjust font sizes like this:

@import "compass/typography"

$base-font-size:   14px
$base-line-height: 21px

header h1
  +adjust-font-size-to(18px)

Not sure this is recommended way but it works for me. I just started using Compass & Blueprint so above might cause problems elsewhere.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文