BinaryDevelop
  1. ホーム
  2. css

[解決済み] HTMLとCSSのBackground-imageが表示されない

2022-02-16 06:28:09

質問

URLもファイル名もダブルチェック済みなのですが、画像が表示されないようです。なぜそのようなことになるのでしょうか？以下は私のコードです。 <p> はbodyタグの中です。私は完全なコードを追加せず、headと特定の問題のみを追加しました）。 

<html>
  <head>
     <title>Head First Lounge.</title>
      <link type="text/css" 
            rel="stylesheet" 
            href="stylesheet/style.css" 
            media="screen"/>
  </head>


<p class = "guarantee">
     Our guarantee: at the lounge, we're committed to providing you, 
     our guest, with an exceptional experience every time you visit.
     Whether you're just stopping by to check in on email over an 
     elixir, or are here for an out-of-the-ordinary dinner, you'll 
     find our knowledgeable service staff pay attention to every detail. 
     If you're not fully satisfied, have a Blueberry Bliss Elixir on us.
</p>

そして、その部分のCSSルールは以下の通りです。 

.guarantee{         
        background-image: url(images/background.gif);
        font-family: "Geogia", "Times New Roman", Times, serif;
        border-color: black;
        border-width: 1px;
        border-style: solid;
        background-color: #a7cece;
            padding: 25px;
            margin: 30px;
            line-height: 1.9em;
            font-style: italic;
            color: #444;
}

解決方法は？

これを試してみてください。 

background-image: url(../images/background.gif);

がない場合は ../ は、スタイルシートフォルダ内のimagesフォルダを探しますが、それは存在しません。 そのため、imagesフォルダのあるディレクトリに戻らなければなりません。

編集 : こんな風にCSSのスタイルを短くすることもできます。 

.guarantee{
    background: #a7cece url(../images/background.gif);
    border: 1px solid black;
}

関連

最新

おすすめ

について
/
プライバシー・ポリシー
/
お問い合わせ
© 2022 BinaryDevelop. すべての権利は、それぞれの所有者に帰属します