0
私はi18nを使用するバイリンガルサイトを持っています。 i18nは、レンダリング時にクラスのタグをサイトのタグに付加します。例えば、私が持っている：@ font-facesが動作しない言語固有のLESSクラス
<html class="en">
<body class="i18n-en">
</body>
</html>
そしてユーザーは、言語を切り替えると、次のようにレンダリング：
<html class="ar>
<body class="i18n-ar">
</body>
</html>
私はプログラム的に英語のデフォルトフォントを置き換えるために、別のフォントをロードLESSファイルを作成しましたがサイトの負荷のときアラビア語版、次のようになるように私は、「DIN-代替bold.ttf」と同じ変数名を持つ「ハルマッタン-Regular.woff」を呼び出しています
body.i18n-en {
@font-face {
font-family: 'DinAlternateBold';
src: url('../fonts/din-alternate-bold.ttf') format('truetype');
}
}
body.i18n-ar {
@font-face {
font-family: 'DinAlternateBold';
src: url('../fonts/Harmattan-Regular.woff') format('woff');
}
}
注意をサイト上のDinAlternateBoldのすべてのインスタンスの置換は自動的に行われます。
ただし、動作していません。後でLESSファイルで宣言されたフォントは、本文のクラスに関係なくページにロードされます。上記のケースでは、アラビア語版と英語版の両方でHarmattan-Regular.woffが読み込まれています。
CSS/LESSでフォントがどのように動作するかについての基本的な情報がありますか？もしそうなら、私が探している効果を達成するための適切な方法は何でしょうか？
各フォントはが単独で使用されたときに正しく読み込まれることに注意してください。これは、私が問題に遭遇している組み合わせでしかありません。
解決策はありませんが、これは技術的にフォントの問題ではありません。これは、同じセレクタに対して、 "color：red"を宣言し、後で "color：blue"というファイルで宣言するのと同じことです。ファイルの後の方が使用されます。ただし、フォントに固有のものは、srcフォントファイルは 'body.i18n-ar'のプロパティではなく、font-family" DinAlternateBold "のプロパティです。 – sn3ll
洞察に感謝します。 – JBeck