Google Fonts
今回は、このモックアップのキービジュアルの部分の「SMILE」のフォント、Raleway を、Google Fonts を使います。
１． 使うWebフォントを探す。
右上のサーチボックスに、フォント名を入力し、検索する。
検索結果が、現れるので、＋ボタンをクリック。
すると、黒いバーが現れるので、そこをクリック。
２． <link> の設定をファイルにコピペ。
すると、バーが、ポップアップするので、コードをCSS ファイルにコピー&ペースト。
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
３． フォントの種類をファイルにコピペ。
同じく、フォントのコードを、CSS のフォント指定の項目に、コピー&ペースト。
font-family: 'Raleway', sans-serif;
この記事を読んだ人はこんな記事にもご興味があるかも
![[ タイポグラフィー ] 覚えておきたい定番明朝体フォント](https://i0.wp.com/webdesign.ki-blog.biz/files/%E3%82%BF%E3%82%A4%E3%83%9B%E3%82%9A%E3%82%AF%E3%82%99%E3%83%A9%E3%83%95%E3%82%A3%E3%83%BC-%E8%A6%9A%E3%81%88%E3%81%A6%E3%81%8A%E3%81%8D%E3%81%9F%E3%81%84%E5%AE%9A%E7%95%AA%E6%98%8E%E6%9C%9D%E4%BD%93%E3%83%95%E3%82%A9%E3%83%B3%E3%83%88.png?resize=150%2C150)
2020-06-30 [ タイポグラフィー ] 覚えておきたい定番明朝体フォント
2016-10-23 主なセレクタの指定方法
2017-08-14 [ CSS ] CSS の優先順位と詳細度![[ 起業 ] 金融機関の種類](https://i0.wp.com/webdesign.ki-blog.biz/wp-content/plugins/wordpress-23-related-posts-plugin/static/thumbs/9.jpg?resize=150%2C150)
2017-10-20 [ 起業 ] 金融機関の種類
2021-04-28 要素を揃えるーデザインの基礎、基本
2019-01-29 [ CSS ] ナビゲーション固定し、スクロールしても動かないヘッダーを作成する方法
(Visited 239 times, 1 visits today)