2013-05-03 2 views
12

Я пытаюсь избавиться от тонкой серой границы эскиза по умолчанию в Twitter Bootstrap.Избавьтесь от щебетать щебетать щебетать

Я можно ориентировать границы, например, если я использую:

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

все границы уменьшенные изменится на красный.

Но если я использую:

.thumbnails > li { border:0; } 

она все еще оставляет границы с тонкой серой линией. Я не могу избавиться от этого. Я попытался изменить цвет на белый (мой фон белый, поэтому это может быть решение), но оно не работает.

Как я могу избавиться от этой тонкой серой границы?

ответ

27

Границы эскизов применяются к элементу .thumbnail, внутри <li>. Во всяком случае, «лишняя» тонкая линия, о которой вы говорите, может быть box-shadow, примененная к этому классу.

Таким образом, вы можете попробовать:

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

В моей версии Bootstrap, именно это:

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; 
} 
2

Я столкнулся с этой же проблемой, но ни настройка границы, ни тени окна на 0 не работали для меня. Наконец, я смог удалить границу, установив прозрачность фона класса эскизов.

Как это:

.thumbnail{ 
    background: transparent; 
} 
0

Если метод посоветовал @albertedevigo не работает, то попробуйте изменить класс от 'IMG-миниатюры' на 'IMG-отзывчивого'.

Класс .img-responsive применяется дисплей: блок; и максимальная ширина: 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; 
    } 

Ура!

0

Вы можете только избавиться от него! Holaa

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

Смежные вопросы