質問: macでダウンロードした日本語フォントをブラケッツで適用するにはどうすればいいのでしょうか? ダウンロードしたフォントがユーザーというところに保存され、そこから右クリックで現在のwebサイト製作中のフォルダに保存しました。 その画像が1枚目です。 クリックすると2枚目の画像のようになり、3枚目の画像へと続きます。 これはちゃんとダウンロードできていないということでしょうか? ちなみに、3枚目の画像のところで、選択項目をクリックし、選択項目をインストールしても何も変わりません。 分かる方いましたらよろしくお願いします。 ![イメージ説明](https://teratail.storage.googleapis.com/uploads/contributed_images/28e4c9c820d1e1c237cb73e975a5d74d.png) ![イメージ説明](https://teratail.storage.googleapis.com/uploads/contributed_images/711c6325f839b8ce2bf5931ce93b1cb4.png) ![イメージ説明](https://teratail.storage.googleapis.com/uploads/contributed_images/ac3289dd268b9d555459e5b6993e1820.png) ブログなどを参考にやってみましたが、うまくいきません。 下記のやり方で間違っているところを教えていただけますでしょうか? ``` @font-face { font-family: 'MyFont';/*集合名前*/ src: local('fonts/fontawesome-webfont.ttf'); } h1{ font-size:1.5em; font-family:'MyFont'; } ```
回答: FontawesomeのようなwebfontはOSなどにインストールして使用する物ではありません。CSSでフォントを指定して使用する物です。 フォントを適当なパス(通常はfontsというディレクトリに入れる場合が多い)において、CSSの@font-faceを用いて指定します。 ``` @font-face { font-family: "MyFont"; src: url("/fonts/MyFont.ttf"); } ``` と言う形です。これで、各部分でfont-familyを@font-faceに設定すると、その部分だけそのフォントが適用されるようになります。どのコードはどのフォントのグリフ(図)になるかはフォントによって異なりますが、``といった形で指定します。Fontawesomeなどは設定済みのCSSを一緒に配っていますので、そちらを使った方がいいでしょう。その他のWebfontも配布サイトに使い方が載っているかと思いますので、そちらを参考にしてください。