スライドショーの背景画像が動作しない

Question

私はスライドショーを含むウェブページをデザインしています。スライドショーの背景は、画像フォルダにある画像です。背景画像はスライドショーの背景に表示されません。自分のマシンのCSSファイルを上書きしようとしましたが、それが表示されました。しかし、サーバーにコンテンツをアップロードすると、背景イメージが表示されませんでした。下記のHTMLコードとCSSセレクタです：

<div style="background:url(../images/slider-bg.png)" class="slideshow"> 
    <div class="row"> 
    <div class="large-12 twelve columns"> 
     <section class="slider"> 
     <div class="flexslider"> 
      <ul class="slides"> 
        <li><img src="images/slider/1.jpg"alt=""></li> 
        <li><img src="images/slider/2.jpg" alt=""></li> 
        <li><img src="images/slider/3.jpg" alt=""></li> 
        <li><img src="images/slider/4.jpg" alt=""></li> 
        <li><img src="images/slider/5.jpg" alt=""></li> 
        <li><img src="images/slider/6.jpg" alt=""></li> 
        <li><img src="images/slider/7.jpg" alt=""></li> 
        <li><img src="images/slider/8.jpg" alt=""></li> 
        <li><img src="images/slider/9.jpg" alt=""></li> 
     </ul> 
    </div> 
    </section> 
</div> 

`

そして、これはCSSのコードです：

.slideshow { 
      margin:0; 
      background:url(../images/slider-bg.png); 
    } 

この問題の原因とどのようにそれを解決するためには何ですか？あまり前もってありがとう！

Answer 1

1. HTMLとCSSファイルにstyle="background:url(../images/slider-bg.png)"を削除しますが、別のディレクトリに

2. チェックを入れることができます

   （...スライダー-bg.png、スライダー-bg.PNGなど）、多分slider-bg.pngは名前にUppercseを持っています

Answer 2

トラブルシューティングするのが少し難しい例はありませんが、フレックススライダーを使用している場合、画像がスライドの裏に隠れていると推測しています。これをテストする方法は、画像が実際に存在することを確認するために、ブラウザの開発ツールで

<div class="flexslider" style="visibility: hidden;"> 

を設定することです。

Answer 3

CSSファイルのスライダ部分よりも先にエラーが発生しました。私はそれを修正し、背景画像が適切に動作しています。この質問とやりとりしたすべての人々に感謝し、エラーを理解するための貴重な手掛かりを私に提供しました。

Answer 4

ファイル全体とその正確な場所がなければ、質問に答えるのはむしろ難しいですが、右のようには見えない小さなディテールがあります.CSSファイルのURLは二重引用符で囲まれていません。

.slideshow { 
      margin:0; 
      background:url("../images/slider-bg.png"); 
}