質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

font

近年は、コンピュータ上、紙面上で利用できる書体データのことをfontといいます。数える時の単位は「書体」で、データとしてのフォントは、デジタルフォントと呼ばれる場合があります。 HTML/CSSでは要素を指定し、フォント情報を調整することができます。

Q&A

解決済

2回答

2610閲覧

Font awesomeが表示されない

RYO.K

総合スコア46

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

font

近年は、コンピュータ上、紙面上で利用できる書体データのことをfontといいます。数える時の単位は「書体」で、データとしてのフォントは、デジタルフォントと呼ばれる場合があります。 HTML/CSSでは要素を指定し、フォント情報を調整することができます。

0グッド

0クリップ

投稿2020/02/20 12:00

Font awesomeを使っているのですがFacebookとTwitterのアイコンは表示されるのですがair bnbとinstagramは表示されません。最後の方の行です。お願いいたします。

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.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <link rel="stylesheet" type="text/css" href="test.css"> 8 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> 9 10<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"> 11 <title>模写1</title> 12 13</head> 14<body> 15 <div class="container-fluid"> 16 <div class="row justify-content-between"> 17 <!--##############header##################--> 18 <div class="col"> 19 <a href="#"> 20 <img class="col-auto mt-4" src="logo.jpeg" a href="#" height="30px " width="30px "> 21 </a> 22 </div> 23 <div class="col-auto"> 24 <ul class="row"> 25 <li class="col month">予想月収</li> 26 <li class="col"><h4>¥151,550</h4></li> 27 <li class="button"><a href="#" class="b2">はじめる</a></li></ul> 28 </div> 29 30 </div></div> 31 <!--##############人数などの検索欄##################--> 32 <div class="box"> <div class="topic"> 33 34 <h1 class="col topic2">Airbnbホストになって、暮らしをレベルアップ</h1> 35 <p >どれくらいの収入が見込めるかチェック</p> 36 <input type="text" placeholder="ロケーション" name="location" class="locate"> 37 <select id="rent" name="rent" class="custom-select sources"> 38 <option value="all">まるまる貸切</option> 39 <option value="only">個室</option> 40 <option value="share">シェアルーム</option> 41 </select> 42 43 <select id="howmany" name="howmany" class="custom-select"> 44 <option value="1">ゲスト1人</option> 45 <option value="1">ゲスト2人</option> 46 <option value="1">ゲスト3人</option> 47 <option value="1">ゲスト4人</option> 48 <option value="1">ゲスト5人</option> 49 <option value="1">ゲスト6人</option> 50 <option value="1">ゲスト7人</option> 51 </select> 52 <h1 class="m">¥80,289<span class="a">月あたり</span></h1> 53 <buttom type="buttom" class="btn btn-danger">はじめる</buttom> 54 55 </div></div> 56 <!--##############サブトピック##################--> 57 <div class="subtopic"> 58 <div class="row"> 59 <div class="col-4"> 60 <h3>Airbnbでホストするこれだけの理由</h3> 61 <p>どんなお家やお部屋でも、Airbnbなら簡単かつ安全にシェアでき、世界中の旅好きな仲間とつながれます。 62 予約可能日から料金、ハウスルール、ゲストとの交流程度まで、すべて自分で決めることができます。</p> 63 </div> 64 <div class="col-4"> 65 <h3>Airbnbならホストも安心安全</h3> 66 <p>万一に備えるUS$1,000,000の財物補償、US$1,000,000の賠償責任保険が全予約に自動付帯。 67 ホストのみなさまと建物・家財の安全をお守りするため全力で取り組んでいます。<br><br> 68 69 <a href="#">ホストを守るAirbnbの仕組みをチェック</a></p> 70 </div> 71 <div class="col-4"> 72 <h3>ゲストは認証済みです</h3> 73 <p>Airbnbは全ゲストを対象に、予約の前に一定の情報(認証済み電話番号、メールアドレスなど)の提供を求めています。 74 さらにご希望の場合は、ほかのホストからの推薦、認証済みIDの取得を追加要件として求めることもできます。</p> 75 </div> 76 </div> 77 78 <!--##############サブトピック2##################--> 79 <div class="three"> 80 <h2>3ステップでホスティング</h2> 81 <div class="row"> 82 <div class="col-4"> 83 <p class="one">1</p> 84 <h3>無料でお部屋を掲載</h3> 85 <p class="sentence">共有のリビングルームから別荘に至るまで、どんなスペースでも登録料なしで共有しましょう。</p> 86 </div> 87 <div class="col-4"> 88 <p class="second">2</p> 89 <h3>ホスティング方法を設定</h3> 90 <p class="sentence">スケジュール、料金、ゲストへの要件をご自身で選択しましょう。 お困りの際にはいつでもサポートいたします。</p> 91 </div> 92 <div class="col-4"> 93 <p class="three">3</p> 94 <h3>はじめてのゲストが来ます!</h3> 95 <p class="sentence">リスティングが掲載されると、条件にかなったゲストから連絡を受けとることができます。 ゲストの到着前に質問があればメッセージを送信できます。<br><br> 96 97 <a href="#">ホストをはじめる方法をチェック</a></p> 98 </div> 99 </div> 100 </div><br><br><br><br><br><br><br><br> 101 <!--##############サブトピック3##################--> 102 <div class="four"> 103 <img src="sub.jpeg"> 104 <div class="all"> 105 <div class="quote">“</div> 106 <h3>ホスティングの収入で、キッチンを新調したり、他の改装費用の一部を賄うことができました</h3> 107 <p class="div-p">Tessaさんはロンドン在住。ホストになって経済的なゆとりができました</p> 108 <p class="btn"><a href="#">ホスト実践例をチェック</a></p> 109 </div> 110 111 </div><br><br><br><br><br><br><br><br> 112 <!--##############question##################--> 113 <div class="question"> 114 <h1>よくある質問の答え</h1><br><br> 115 <ul> 116 <li><a href="#">Airbnbホストになれるのはどんな人?</a></li> 117 <li><a href="#">予約前にゲストに求められる要件は?</a></li> 118 <li><a href="#">お部屋の掲載料はいくら?</a></li> 119 <div class="right"> 120 <li><a href="#">家財破損があった場合、どのような補償がありますか?</a></li> 121 <li><a href="#">リスティングの料金を選ぶには?</a></li> 122 <li><a href="#">料金設定の支援ツールはありますか?</a></li> 123 </div> 124 </ul><br><br><br><br><br><br><br><br><br><br><br> 125 <p class="hosting">ホスティングの詳細はこちら</p><br><br><br><br><br><br><br><br><br><br> 126 <p class="detail"><span>初期設定</span><br>ホスティング入門ガイド<br><a href="#">もっと詳しく</a></p> 127 <p class="detail"><span>安全</span><br>ホストを守るAirbnbのしくみ<br><a href="#">もっと詳しく</a></p> 128 <p class="detail"><span>マネープラン</span><br>Airbnbで収益を得るには<br><a href="#">もっと詳しく</a></p> 129 <br><br><br><br><br><br><br><br><br> 130 </div> 131 <!--##############last##################--> 132 <div class="last"> 133 <h1 class="money">収益化してみますか?</h1> 134 <button type="button">はじめる</button> 135 <div class="first"> 136 <ul class="second"> 137 <li class="top">Airbnb</li><br> 138 <li><a href="#">採用情報</a></li> 139 <li><a href="#">ニュース</a></li> 140 <li><a href="#">ポリシー</a></li> 141 <li><a href="#">ヘルプ</a></li> 142 <li><a href="#">ダイバーシティ&ビロンギング</a></li> 143 <li><a href="#">企業情報</a></li></ul> 144 </div> 145 <ul class="second"> 146 <li class="top">スタッフのおすすめ</li><br> 147 <li><a href="#">信頼&安全</a></li> 148 <li><a href="#">お友達紹介クーポン</a></li> 149 <li><a href="#">Airbnb Citizen</a></li> 150 <li><a href="#">出張</a></li> 151 <li><a href="#">アクティビティ</a><span>新着</span></li> 152 <li><a href="#">Airbnbmag</a></li> 153 </ul> 154 <ul class="second"> 155 <li class="top">ホスティング</li><br> 156 <li><a href="#">おもてなしの心</a></li> 157 <li><a href="#">ホストの責任</a></li> 158 <li><a href="#">コミュニティセンター</a></li> 159 <li><a href="#">体験を掲載</a><span>新着</span></li> 160 <li><a href="#">オープンホーム</a></li> 161 </ul> 162 <ul class="second"> 163 <a href="#"><i class="fab fa-facebook-square"></i></a> 164 <a href="#"><i class="fab fa-twitter"></i></a> 165 <a href="#"><i class="fab fa-instagram-square"></i></a> 166 <li><a href="#"></a></li> 167 <li><a href="#"></a></li> 168 <li><a href="#"></a></li> 169 <li><a href="#">利用規約</a></li> 170 <li><a href="#">プライバシー</a></li> 171 <li><a href="#">サイトマップ</a></li> 172 </ul> 173 <i class="fab fa-airbnb"></i> 174 175 176 </div> 177 </div> 178 179</body> 180</html>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2020/02/20 12:37 編集

> 最後の方の行です。 でしたら<body>内の該当箇所以外は提示不要かと思います。
guest

回答2

0

提示のバージョンにはないみたいですよ。

インスタの方はfa-instgram しかないですし
イメージ説明

airbnb自体ないです。
fa-air
イメージ説明

fontawesome内の検索だと
airbnbはVersion 5.8.0になってます。

https://use.fontawesome.com/releases/v5.8.0/css/all.cssにはありました。

instagram-squareはVersion 5.12.1になってますね。

お使いのバージョンは古いようです。

投稿2020/02/20 12:50

m.ts10806

総合スコア80765

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

RYO.K

2020/02/20 13:06

本日ダウンロードしたので新しいはずなのですが、、、
RYO.K

2020/02/20 13:50

どうやれば使えるようになるのでしょうか?
m.ts10806

2020/02/21 01:42 編集

使ってるCDNのバージョンが古いと指摘してるのでやることは明確かと思いますが…。 この手のCDNはリリースバージョン毎に用意されてるのでURL部分書き換えれば通るのでは。 例えば <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"> から <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.12.1/css/all.css"> に。 あの、何も意味わからずとりあえず置くのはやめたほうがいいですよ。 本来不要なものまで置きっぱなしになってパフォーマンス悪化を招く温床になりえます。
RYO.K

2020/02/21 09:33

意味わからず置いてはないですありがとうございます!
m.ts10806

2020/02/21 10:03

分かってたら今回の質問がでるはずがないと思います。 CDN利用で「ダウンロードした」と表現はできませんし、「新しいはず」の根拠が示されていません。 (質問者さんを貶める意図はなく事実からの解釈です)
RYO.K

2020/02/21 10:04

了解です!
m.ts10806

2020/02/21 11:28

んー。原因明らかで解決策も出てるのに未解決のまま放置して次の質問いかれても。 そのうち誰もアドバイスしなくなりますよ。
RYO.K

2020/02/22 07:18

解決できてないから未解決のままにしてるんですよ???? 試したけどできなかったので。
退会済みユーザー

退会済みユーザー

2020/02/22 07:37

> どうやれば使えるようになるのでしょうか? > 意味わからず置いてはないですありがとうございます! 上記二つは矛盾してるんだけどね。
m.ts10806

2020/02/22 09:26

何を試したのか書かないと言うことは解決する気はないと。 あとはご勝手にどうぞ。アドバイスして損した。 厚意で成り立つところには向いてないですよ。MENTAでもなんでもおかね払ってやってもらってください。
m.ts10806

2020/02/22 09:28

asahina1979さん そうですね。分かってるなら質問することがおかしい。
guest

0

自己解決

Font awesomeを使わなくなったため。

投稿2020/02/22 13:40

RYO.K

総合スコア46

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2020/02/22 21:33

問題解決する気なしとして低評価しました。 この回答が何の参考になるんでしょう。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問