2013-02-13 40 views
11

Tôi đang sử dụng twitter bootstrap trên một chủ đề tôi đã tải xuống và html tùy chỉnh của tôi trong danh sách hình thu nhỏ của tôi đang hiển thị nhưng hình ảnh thì không.Danh sách thu nhỏ Bootstrap không hiển thị hình thu nhỏ

Điều tra mã, hiển thị thẻ hình ảnh và vị trí hình ảnh hoạt động ở đó. Dưới đây là một bức tranh về những gì đang xảy ra:

enter image description here

Mã cho danh sách thumbnail của tôi là thế này:

<div class="span9 space"><ul class="thumbnails"><li class="span3"> 
         <div class="thumbnail"> 
          <img data-src="http://s3.amazonaws.com/brewerydbapi/beer/YAKFea/upload_1CxY2l-medium.png" alt=""> 
          <h3>90 Shilling</h3> 
          <p>Odell Brewing Company</p> 
         </div> 
        </li><li class="span3"> 
         <div class="thumbnail"> 
          <img data-src="http://s3.amazonaws.com/brewerydbapi/beer/oeGSxs/upload_FiPLQC-medium.png" alt=""> 
          <h3>Naughty 90</h3> 
          <p>Toppling Goliath Brewing Company</p> 
         </div> 
        </li><li class="span3"> 
         <div class="thumbnail"> 
          <img data-src="noImage.gif" alt=""> 
          <h3>90-Shilling Scotch Ale</h3> 
          <p>Taps Fish House & Brewery</p> 
         </div> 
        </li><li class="span3"> 
         <div class="thumbnail"> 
          <img data-src="noImage.gif" alt=""> 
          <h3>Williams Ceilidh 90</h3> 
          <p>Williams Brothers Brewing Company</p> 
         </div> 
        </li><li class="span3"> 
         <div class="thumbnail"> 
          <img data-src="noImage.gif" alt=""> 
          <h3>Boscos 90 Shilling Ale</h3> 
          <p>Boscos Brewing Company</p> 
         </div> 
        </li><li class="span3"> 
         <div class="thumbnail"> 
          <img data-src="noImage.gif" alt=""> 
          <h3>Dundee Export 90 Scotch Ale</h3> 
          <p>Dundee Brewing Co.</p> 
         </div> 
        </li><li class="span3"> 
         <div class="thumbnail"> 
          <img data-src="https://s3.amazonaws.com/brewerydbapi/beer/qqTzHb/upload_mGIvsJ-medium.png" alt=""> 
          <h3>90 Minute IPA</h3> 
          <p>Dogfish Head Craft Brewery</p> 
         </div> 
        </li><li class="span3"> 
         <div class="thumbnail"> 
          <img data-src="http://s3.amazonaws.com/brewerydbapi/beer/jdQySZ/upload_jbcADO-medium.png" alt=""> 
          <h3>I-90 India Pale Ale</h3> 
          <p>Ancient Lakes Brewing Company</p> 
         </div> 
        </li></ul>      

      </div> 

Cuối cùng có không có lỗi hiển thị trong chrome kiểm tra nguyên tố, và tôi không có bất kỳ css nội tuyến nào trên trang này.

+2

Thay vì dữ liệu-src trên thẻ hình ảnh của bạn, hãy thử chỉ src. –

+0

Đây là một câu đố không có mặt đất: http://jsfiddle.net/BZudQ/ Sử dụng 'src' không hoạt động, nhưng tôi không chắc tại sao. – isherwood

+1

Cập nhật fiddle hiển thị hình ảnh hoạt động: http://jsfiddle.net/BZudQ/1/ – isherwood

Trả lời

24

data-src được sử dụng để có được một hình ảnh giữ chỗ trong các ví dụ khởi động. Chỉ cần sử dụng src

+0

Vui lòng kiểm tra kỹ trước khi bạn phê duyệt các chỉnh sửa quá nhỏ :) – bonCodigo

+1

Không thể tin được, cảm ơn bạn! ;) – Roman

+1

Tại sao '' hoạt động nhưng không phải hình ảnh cục bộ như ''? Hình ảnh hiển thị ở bất kỳ nơi nào khác! – BentCoder

Các vấn đề liên quan