Как избавиться от миниатюры Twitter-бутстрапа

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

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

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

все границы миниатюр меняются на красный.

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

.thumbnails > li { border:0; }

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

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

Ответ 1

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

Итак, вы можете попробовать:

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

Ответ 2

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

Вот так:

.thumbnail{
  background: transparent;
}

Ответ 3

В моей версии 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;
}

Ответ 4

Если метод, рекомендованный @albertedevigo, не работает, тогда попробуйте изменить класс с "img-thumbnail" на "img-отзыв" .

В классе .img-responsive применяется 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;
    }

Ура!

Ответ 5

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

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