0

@font-face の重みを数値だけでなく文字列で定義する方法があるかどうか疑問に思っています。

@font-face {
    font-family: 'My Font';
    src: url('../fonts/MyFont/light.eot');
    …
    font-weight: 'light', 300;
    font-style: normal;
}
@font-face {
    font-family: 'My Font';
    src: url('../fonts/MyFont/thin.eot');
    …
    font-weight: 'thin', 200;
    font-style: normal;
}

ウェイトが一致していれば、誰かがデザインをコードに分割する方が簡単だと思います (たとえば、Photoshop では、フォントのウェイトは300ではなくlightになります)。

W3仕様を読んだ後、名前を数字に一致させるつもりのようですが、それはばかげているように見えるので、何かが足りないと思います.

4

3 に答える 3

2

リンク先の CSS2.1 仕様では、特定の数値に対応する特定のキーワード セットのみが定義されています。現在の仕様であろうと将来の仕様であろうと、作成者が数値のキーワードを定義できるようにすることについては何も述べていません。

数値とともに、ルールのfont-weight記述子で指定できるキーワードはandのみです(一方、andは相対値であるため、指定できません)。カスタム キーワードを指定できる場合でも、それらのカスタム キーワードを許可するようにプロパティを再指定する必要があり、ブラウザはそれらのカスタム キーワードを認識しなければなりませんが、認識しません。@font-facenormalboldbolderlighterfont-weight

于 2013-09-06T17:58:21.513 に答える
2

定義に使用できる 4 つの文字列があります: font-weight、normal、bold、bolderおよび lighterリンク先の仕様にすべて記載されています。

独自のものを作成してプリプロセッサを使用する場合は、重みの変数を作成して、必要な数だけ持つことができます。

サス

変数.scss.css

$verythin: 100;
$thin: 200;
$medium: 300;
$thick: 500;
$unnecessarilybold: 600;

main.scss.css

@font-face {
    font-family: 'My Font';
    src: url('../fonts/MyFont/thin.eot');
    …
    font-weight: $thin;
    font-style: normal;
}
于 2013-09-06T18:00:22.213 に答える