背景画像が表示されないです。

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
（例）PHP(CakePHP)で●●なシステムを作っています。
■■な機能を実装中に以下のエラーメッセージが発生しました。

発生している問題・エラーメッセージ

background-image　背景画像が表示されない

エラーメッセージ
```背景画像が表示されません。
回答よろしくお願いします。

### 該当のソースコード
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>html</title>
    <link rel="stylesheet" href="stylesheet.css">
  </head>
  <body>
    <header>
      <div class="header-wrapper">
        <div class="header-left">
          <span class="fa fa-airbnb"></span>
          <a href="#" class="header-btn">概要</a>
          <a href=="#" class="header-btn">準備</a>
          <a href="#" class="header-btn">安全</a>
          <a href="#" class="header-btn">マネープラン</a>
          <div class="header-right">
            <a href="#" class="start-btn">はじめる</a>
          </div>
        </div>
      </div>
    </header>
    <div class="top-wrapper">
      <div class="tops">
        <h1>Airbnbホストになって、暮らしをレベルアップ</h1>
        <p>宿泊施設の内容を記入</p>
      </div>
    </div>
  </body>
</html>


ここからCSSです！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！



header {
  height:100px;
  background-color:gray;
}

.header-left air{
  float:left
}

.fa-airbnb {
}

.header-btn{
  float:left;
  display:block;
  color:black;
  margin:30px 20px;
}

.start-btn {
  color:white;
  padding:10px 15px;
  display:block;
}

.header-right {
  float:right;
  background-color: #cc3366;
  border-radius:10px;
  margin: 30px 100px 30px 0;
}

.top-wrappper {
  background-image:url("airbnb-3399753_1920.jpg")；
  height: 500px;
  width:300px;
}

```ここに言語名を入力 html css
ソースコード

試したこと

youtubeやGoogleで何度も検索しました。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。
airbnbのサイトを真似して作ろうと思ったのですが、背景画像が表示されません。
YoutubeやGoogleで検索したのですが、どこが間違っているのかわかりません。
ぜひ回答よろしくお願いします。
しょうもないミスの場合、本当に申し訳ございません。

1T2R3M4

2020/08/30 13:09

airbnb-3399753_1920.jpg はありますか。

sakusakukun

2020/08/30 13:20

safariで検索して、上のURLをコピーしたものです。あと、フリー素材のサイトの画像のURLをコピーして貼り付けましたが、ダメでした。どういうところからどのURLを撮ってくれば良いのでしょうか？？やはり、そこが問題なのですかね、、、、ご回答ありがとうございます。

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

回答1件

ベストアンサー

※質問のソースから抜粋

html
1<div class="top-wrapper">

css
1.top-wrappper {
2background-image:url("airbnb-3399753_1920.jpg")；
3height: 500px;
4width:300px;
5}

htmlで指定しているクラスがCSSに存在しないようです。

top-wrapper (HTMLで指定しているクラス
top-wrappper (CSSで定義しているクラス

投稿2020/08/30 13:21

attakei

総合スコア2740

sakusakukun

2020/08/30 13:28

すいません。初歩的なミスでした。申し訳ございません。ご回答ありがとうございます！！改善したのですが、まだ表示されませんでした。????

attakei

2020/08/30 13:34

質問そのものについているコメントを読みましたが、次のどちらかをしないとだめじゃないかと。 - background-imageとして使おうとしている画像の「URL(httpから始まるフルURL)」を取得して、それを指定する - background-imageとして使おうとしている画像をダウンロードして、cssで指定している名前でcssファイルと同じパスに置く

sakusakukun

2020/08/30 23:52

わかりました。本当にありがとうございます！

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