Flexslider DISABLE全寬顯示，自動調整

Question

我剛剛安裝了一個包含滑塊的博客模板。模板來自：

sight-soratemplates.blogspot.com

你可以從滑塊看，圖像是全幅的，但是我代替他們有一半左右的寬度圖像，但不是因爲它顯示圖像是，它重複它們以覆蓋整個頁面的寬度。

我該如何改變這種情況？我是一個完整的html編碼初學者。我希望滑塊自動適應每個圖像。

滑塊的HTML代碼，與1個圖像一起是：

<b:if cond='data:blog.pageType == &quot;index&quot;'> 
<div class='slider' style='overflow:hidden;'> 
    <div class='fullwidth flexslider' id='homeslider'> 
      <ul class='slides'> 
       <li data-height='500' style='position:relative; background: url(http://x.jpg) 50% 0'> 
        <div class='caption_wrapper'> 
         <div class='caption'> 
           <h3><a href='#'>Random Title</a></h3>Random Caption<a href='#'>Read more </a> 
         </div> 
        </div> 
       </li> 

Answer 1

這是因爲background image確實重演。您可以通過將no-repeat添加到所有圖像來避免此情況。

例如，你有這樣的：

element.style { 
    background: url("https://lh3.googleusercontent.com/-X29Krwb_fbQ/UcMfaRJm_TI/AAAAAAAAB2Y/QaQkIwWMZ5c/s1600/9d.jpg") repeat scroll 50% 0 rgba(0, 0, 0, 0); 

將其更改爲

element.style { 
    background: url("https://lh3.googleusercontent.com/-X29Krwb_fbQ/UcMfaRJm_TI/AAAAAAAAB2Y/QaQkIwWMZ5c/s1600/9d.jpg") no-repeat scroll 50% 0 rgba(0, 0, 0, 0); 

PS：您的網站看起來棒極了。