fontawesomeのクラスが反映されないのと、バージョンの関係について

fontawesome 現バージョン（5.8.1）公式サイト内でアイコンを検索し、コードをコピペするも四角いマークが出るだけで反映されませんでした。

環境：MacBook Pro
ブラウザ：Chrome
エディタ：Atom

時計マークを「oclock」で検索しコードで、

<i class="far fa-stopwatch"></i>

だったのですがそのままコピペしても表示されず、
他の別なきちんと表示されているアイコンで fas から始まるものがあったので（コード内に）、
試しに

<i class="fas fa-stopwatch"></i>

と変えたら表示されました。

現バージョンではfar からfasに変更しないと表示されないとかあるのでしょうか？
たまたま、まぐれで気づいたから良いですが、気づかないとこのまま数時間放置でした。

バージョンが４から５に変わっているのであれば、大幅なアップデートがあるとも思いますが、
これらは同じ5で、 farが5.0.0です。

何故でしょうか？
また、「今のバージョンはfarをfasに変えれば表示されます」などの文言などどこか記載でもあるのでしょうか？
fal　ってのもありますよね。
まるで不便すぎるので、どう活用していったら良いのかわかりません。
どこを見ればそのような事が一目瞭然でわかるか教えてください。

これでは、アイコン検索してそのコードをコピペしても反映されないので、かなり不便です。

HTML
1<!DOCTYPE html>
2<html lang="ja">
3  <head>
4    <meta charset="utf-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
6    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
7    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
8    <link rel="stylesheet" href="style.css">
9    <link rel="icon" href="img/airbnb_logo.ico">
10    <title>現地の人から借りる家、体験&スポット - Airbnb</title>
11  </head>
12  <body>
13
14
15
16<i class="fas fa-stopwatch"></i>
17<p>↑反映される</p>
18
19<i class="far fa-stopwatch"></i>
20<p>↑反映されない</p>
21
22
23    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
24    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
25    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
26  </body>
27</html>
28

以上、よろしくお願いします。

行動規範の内容に同意します

回答1件

ベストアンサー

今回使用しようとしているストップウォッチのアイコンはsolid styleなのでfasです。
farはregular style、falがlight styleです。
ストップウォッチのfar、falは無料版では使えないようです。
各アイコンのページでどのスタイルが使えるか確認してください。
ストップウォッチのアイコンのページ

投稿2019/03/23 02:01

dit.

総合スコア3235

退会済みユーザー

2019/03/23 02:42 編集

そう言う事でしたか。ですが、mailアイコンは <i class="far fa-envelope"></i> こちらで表示されます。私は無料版ですが　far　で使えるのはどう言う事なのでしょうか？アイコンによって、時計アイコンはfasが無料、 mailアイコンはfasとfarが無料のようにバラバラと言う事でしょうか？まさかアイコンごとに違うのですかね...。