擺脫Twitter Bootstrap縮略圖邊框

我試圖擺脫Twitter Bootstrap中的默認縮略圖薄灰色邊框。擺脫Twitter Bootstrap縮略圖邊框

我可以指定邊界，例如，如果我使用：

.thumbnails > li { border:1px solid red; }

所有縮略圖邊框變爲紅色。

但是，如果使用：

.thumbnails > li { border:0; }

它仍然留下的邊界用細灰線。我無法擺脫這一點。我試圖將顏色更改爲白色（我的背景是白色的，所以它可能是一個解決方案），但它不起作用。

我該如何擺脫那個薄的灰色邊框？

來源

2013-05-03 Jorge

縮略圖邊框應用於.thumbnail元素，位於<li>之內。無論如何，你所說的「額外」細線可能是適用於該類的box-shadow。

所以，你可以嘗試：

.thumbnail { 
    border: 0 none; 
    box-shadow: none; 
}

來源

2013-05-03 11:55:27 albertedevigo

在我的版本自舉，它是這樣的：

img.wp-post-image { 

    border-radius: 3px; 
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); 
}

他們都設置爲0，和它的工作：

img.wp-post-image { 

    border-radius: 0; 
    box-shadow: 0; 
}

來源

2014-04-15 03:27:23 chau

我遇到了同樣的問題，但沒有設置邊框或框陰影爲0爲我工作。我終於可以通過將縮略圖類的背景設置爲透明來刪除邊框。

像這樣：

.thumbnail{ 
    background: transparent; 
}

來源

2016-01-24 10:20:07

如果@albertedevigo通知的方法不工作，然後嘗試改變從 'IMG-縮略圖' 的類 'IMG響應'。

.img響應類應用display：block;和最大寬度：100％;和高度：自動;到圖像。

HTML

<div class="row no-pad"> 
      <div class="col-md-2"><img src="E:\VIPUL\Adobe Lightroom\Modified\Awesome.jpg" 
class="img-responsive" alt="Awesome.jpg"> 
     </div> 
     </div>

CSS

 .row.no-pad.img-responsive{ 
     margin-right:0px; 
     margin-left:0px; 
     border:none; 
    }

乾杯！

來源

2016-03-18 06:44:56

你只能用它來擺脫它！ Holaa

.img-responsive { 
 
\t width:100%; 
 
\t border:none; 
 
}

來源

2017-02-02 07:59:29 Emre

擺脫Twitter Bootstrap縮略圖邊框

回答

相關問題