刪除圖像中的空白

-1

我有很多圖像，我的代碼如下。刪除圖像中的空白

某些圖像頂部或左側的某些圖像中存在空白區域。我找不到如何解決它。我已經設置了寬度和最大寬度。

我將圖像保存爲tmb文件。它可能是由於它？

我該怎麼解決？謝謝！

.pbombd-thumbnail { 
 
    \t float:left; 
 
    \t margin-top: 10px; 
 
    \t margin-right: 17px; 
 
    \t width: 220px; 
 
    \t padding: 0px !important; 
 
    \t border-radius: 4px; 
 
    \t border: 0px; 
 
    } 
 

 
.pbombd-img-thumb 
 
{ 
 
\t 
 
\t max-width:218.4px; 
 
\t max-height: 178px; 
 
\t min-width: 218.4px; 
 
\t min-height: 178px; 
 
\t margin:0px; 
 
\t border-top-left-radius: 4px; 
 
\t border-top-right-radius: 4px; 
 
}

<div class="thumbnail pbombd-thumbnail"> 
 

 
    <a href="#"> 
 
     <img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97350&w=350&h=350" class="pbombd-img-thumb"/> 
 
    </a> 
 
    </div>

編輯：我忘了在問題補充這個CSS：

.thumbnail { display: block; padding: 4px; margin-bottom: 20px; line-height: 1.42857; background-color: #FFF; border: 1px solid #DDD; border-radius: 4px; transition: all 0.2s ease-in-out 0s; }

來源

2015-10-06 ci_lover

你的圖片的高度和寬度是否相同？ –

添加display: block;到.pbombd-img-thumb。顯示爲inline或inline-block可能會導致額外的空間。

.pbombd-thumbnail { 
 
    \t float:left; 
 
    \t margin-top: 10px; 
 
    \t margin-right: 17px; 
 
    \t width: 220px; 
 
    \t padding: 0px !important; 
 
    \t border-radius: 4px; 
 
    \t border: 0px; 
 
     background-color: orange; 
 
    } 
 

 
.pbombd-img-thumb 
 
{ 
 
     display: block; 
 
\t max-width:218.4px; 
 
\t max-height: 178px; 
 
\t min-width: 218.4px; 
 
\t min-height: 178px; 
 
\t margin:0px; 
 
\t border-top-left-radius: 4px; 
 
\t border-top-right-radius: 4px; 
 
}

<div class="thumbnail pbombd-thumbnail"> 
 

 
    <a href="#"> 
 
     <img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97350&w=350&h=350" class="pbombd-img-thumb"/> 
 
    </a> 
 
    </div>

來源

2015-10-06 21:31:23

我試過了，但它是一樣的。我編輯了我的問題。我爲縮略圖類添加了css。 –

嘗試增加vertical-align: middle;到img元素的CSS。一些媒體元素有空白區域。

來源

2015-10-07 02:30:10

沒有任何變化。 –

刪除圖像中的空白

回答

相關問題