指南针字体混合粗体

发布于 2024-10-20 04:09:08 字数 952 浏览 0 评论 0原文

我正在将 @font-face mixin 与 Compass (0.11.beta.1) 一起使用，并且在定义粗体和斜体字体时遇到问题。

我可以使用以下代码成功加载和使用字体：

@include font-face("PTSerif", font-files("/path/to/font/PTF55F_W.ttf", truetype), "/path/to/font/PTF55F_W.eot");

但是我找不到定义粗体字体的方法。消息来源称 style 参数已被弃用，尝试使用它对输出 .css 文件没有影响。

@mixin font-face($name, $font-files, $eot: false, $postscript: false, $style: false) {
  @if $postscript or $style {
    @warn "The $postscript and $style variables have been deprecated in favor of the Paul Irish smiley bulletproof technique."; }
  @font-face {
    font-family: quote($name);
    @if $eot {
  src: font-url($eot); }
    src: local("☺"), $font-files; } }

我目前有两种选择：

之后编辑 .css 文件。不利于可维护性
为不同的样式定义不同的字体（也不太理想，但目前最可行）例如
@include font-face("PTSerif")
@include font-face("PTSerif-B")

还没有找到任何如何正确执行此操作的示例 - 能够使用 font-weight:bold;

提前致谢。

原文

I am using the @font-face mixin with Compass (0.11.beta.1) and having trouble defining my bold and italic fonts.

I can successfully load and use fonts with the following code:

@include font-face("PTSerif", font-files("/path/to/font/PTF55F_W.ttf", truetype), "/path/to/font/PTF55F_W.eot");

However I can't find a way to define the bold font-face. The source says that the style argument has been deprecated, and trying to use it has no effect on the output .css file.

@mixin font-face($name, $font-files, $eot: false, $postscript: false, $style: false) {
  @if $postscript or $style {
    @warn "The $postscript and $style variables have been deprecated in favor of the Paul Irish smiley bulletproof technique."; }
  @font-face {
    font-family: quote($name);
    @if $eot {
  src: font-url($eot); }
    src: local("☺"), $font-files; } }

I currently have two alternatives:

Edit the .css files afterwards. No good for maintainability
Define different fonts for the different styles (also not ideal, but currently the mos workable) e.g.
@include font-face("PTSerif")
@include font-face("PTSerif-B")

Haven't been able to find any examples of how to do this properly- being able to use font-weight:bold;

Thanks in advance.

分享到QQ

分享到微博