プログラミング

Railsでfont-familyを使う方法

今回は、Ruby on railsでfont-familyを使う方法をご紹介したいと思います。

今、個人アプリを作っているんですが、デフォルトの文字じゃなんか、物足りないと
思っていて、調べていたら色々な方法があって30分ほど経過・・・

結局今回紹介する方法が一番簡単でしたので是非参考にしてください。

Google fontを使う準備をする

フォントで代表的なものは下記のGoogle fontです。

https://fonts.google.com/

 

色々なフォントがありますが、好きなフォントを決めてクリックします。

次に、フォントの太さを選んで、右側に青いプラスマークがあるのでクリック

すると、右側にウィンドーが出てきます。

Embed、@importをクリックして、下記緑枠の2つを使用して、今回のフォントを利用できるようにします。

 

まず、一つ目の@importの箇所をコピペして、VS codeのapplication.cssにペーストします。
これで準備完了です。

実際にフォントを変えてみよう

今回下記のMy blogという文字を、上記で設定したフォントに変更してみましょう。

上記で説明しました、google fontのページで黄緑色で囲った
下記の記述を、変更したい箇所に記述するだけで反映されます。

font-family: 'PT Sans', sans-serif;

実際に見てみると、しっかりと変わっていますね!

まとめ

いかがでしたか?

実際調べていると、意外と時間がかかってしまいましたので
皆さんは、一発で攻略してくださいね!

-プログラミング

© 2021 yuyalife Powered by STINGER