1

Google Fonts API を使用してウェブサイトに Ubuntu フォントを使用しようとしましたが、Google が持っている Ubuntu フォントとマシンにインストールされているローカルの Ubuntu フォントとの間で競合が発生したため、問題が発生しました。最終的な結果として、font-weight 400 では Ubuntu フォントを使用できません。私は font-weight 300 と 500 に制限されています。メイン サイトはとにかく font-weight 300 ですが、見出しを強調するために font-weight 400 を使用したいと考えていました。

Google Fonts がローカル フォントへの参照をすべて削除するために使用する CSS を編集することで、これを回避したいと考えています。これを手動で試してみましたが、動作します。問題は、Google が提供する CSS がブラウザーに合わせてカスタマイズされているため、表示された CSSを編集してローカルに保存すると、同じブラウザーを使用しているユーザーに対してのみフォントが機能することです。

では、その場で CSS を編集して、ローカル フォントへの参照を削除することは可能でしょうか?

.

私は大まかな解決策のアイデアを持っていますが、それが実際に実装できるかどうかを知るには十分な教育を受けていません. 基本的に、エンド ユーザーが を通じて要求する PHP スクリプトを使用できます<link rel="css.php">。この PHP ファイルは、ブラウザに関する情報を含むユーザーの HTTP リクエストを読み取り、まったく同じ HTTP 情報を使用して Google Fonts API へのリクエストを送信します。Google Fonts は、ユーザーが必要とする CSS を提供します。残りは文字列操作です。これは機能しますか？

4

1 に答える 1

0

その場合は、フォントのリクエストを手動で行う必要があります。だから、あなたは要求しているかもしれませんhttp://fonts.googleapis.com/css?family=Ubuntu。そこに移動して (さまざまなブラウザーで - ブラウザーごとに要求を処理します)、コードをコピーします。今のところ、Chrome で提供されるものを使用するだけですが、含めたいフォント形式はさまざまです。それは言います：

@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  src: local('Ubuntu'), url(http://themes.googleusercontent.com/static/fonts/ubuntu/v4/_xyN3apAT_yRRDeqB3sPRg.woff) format('woff');
}

localsource パラメーターの を削除して、ローカル CSS をコピーします。次に、font-family名前を次のように変更します。

@font-face {
  font-family: 'Webuntu';
  font-style: normal;
  font-weight: 400;
  src: url(http://themes.googleusercontent.com/static/fonts/ubuntu/v4/_xyN3apAT_yRRDeqB3sPRg.woff) format('woff');
}

最後に、新しい名前を使用するようにフォント参照を更新します。

p { font-family:'Webuntu', sans-serif; }

PHPは必要ありません:)

于 2013-08-18T20:16:34.980 に答える