無法添加背景圖片來引導模態

我想對模式的頭部添加背景圖片，所以我想如果我會做到以下幾點：無法添加背景圖片來引導模態

.modal-header{ 
background-image: url('../images/extended_top_provider.gif'); 
}

頭將顯示圖像但它的確如此。相反，它具有以下功能：

我也嘗試添加圖標爲不同的瀏覽器，但它不顯示任何圖像。

任何幫助，將不勝感激

UPDATE

我能夠添加圖像，不正確的，一些錯誤的圖片的路徑，但下面的圖片是不正確對齊，我不知道爲什麼。

$(function(){ 
 
    $('##myModal').modal('show'); 
 
});

.client_logos { 
 
    display: inline-block; 
 
    width:100%; 
 
    }

<div class="ie-only" style="overflow-y:hidden;"> 
 
     \t <div class="modal fade in" id="myModal" aria-hidden="false"> 
 
      \t <div class="modal-dialog modal-md custom-height-modal"> 
 
       \t <div class="modal-content"> 
 
        \t <div class="modal-header" style="background: url('http://www.freedigitalphotos.net/images/img/homepage/87357.jpg');"> 
 
         \t <button type="button" class="close" data-dismiss="modal">x</button> 
 
          <h2 class="modal-header">Outdated Browser Detected</h2><p>Our website has detected that you are using an outdated browser. Using your current browser will prevent you from accesing featuers on your website. An upgrade is not required, but is strongly recommend to improve your browsing experince on our website.<br /><br /> 
 
          <b>Use the links below to download a new browser or upgrade your existing browser.</b></p>      
 
         </div><!---Modal-Header Div---> 
 
         <div class="modal-body client_logos"> 
 
         \t <p> <img class="img-responsive" src="https://upload.wikimedia.org/wikipedia/en/thumb/e/e3/Firefox-logo.svg/120px-Firefox-logo.svg.png" alt="image" /> 
 
          \t <img class="img-responsive" src="https://productforums.google.com/forum/image/GDF/15104268797498972201/8f39d8ec-5483-4e30-977d-817c8fd1c110" /> </p> 
 
         </div><!---Modal-Body Div---> 
 
         <div class="modal-footer"> 
 
         \t <p class="text-center"><a class="btn btn-default" data-dismiss="modal">Close</a></p> 
 
         </div><!---Modal-Footer Div---> 
 
        </div><!---Modal-Content Div---> 
 
       </div><!---Custom Height Div---> 
 
      </div><!---Modal Fade in Div---> 
 
     </div><!---Start of Modal Div---> \t \t \t \t 
 
\t \t <!--End of Modal container-->

來源

2016-07-28 Roberto Flores

哦，可能是因爲模態頭沒有包含任何東西，所以它沒有大小？ –

真的，但我能夠抓住一個圖像，並把樣式放在模態標頭所在的同一個div上，它看起來很好 –

現在你寫了你想如何定位你的圖像 –

這可能是因爲一個很簡單的道理，background-image屬性不採取任何的寬度和高度，所以你可以指定你的寬度和高度.modal-header這樣的：

.modal-header{ 
    width:100px; 
    height:100px; 
    background-image: url('../images/extended_top_provider.gif'); 
}

試試這個，並找出差異，如果你想你可以簡單地在.modal-header內添加一個<img>標籤，但請注意background-image不停止頁面呈現，而img標記:)

來源

2016-07-28 22:27:40

如果我想用img標籤去，我該怎麼辦？ –

好吧，你必須編寫示例代碼，然後我會爲你編輯一些小東西:)我不想做所有的工作，請用這個模式做一個小提琴 –

無法添加背景圖片來引導模態

回答

相關問題