Как настроить изображение в моем случае

Question

У меня есть изображение, которое мало, но мне все же нужно, чтобы оно было отзывчивым.

Я использую бутстрап и img-responsive класс на нем.

<img class='col-lg-1 col-md-1 col-sm-1 img-responsive' id='ball' src='/ball.png'/> 

Моя проблема даже я использую col-lg-1 мяч по-прежнему тихо большой в моем экране. Я хочу, чтобы он был меньше col-lg-1, но не уверен, как это сделать в бутстрапе. Может ли кто-нибудь мне помочь? Большое спасибо!

Answer 1

Вам нужно будет написать CSS.

/* replace "@screen-lg-min" with "1200px" if you're not using .less directly. */ 
@media (min-width: @screen-lg-min) { 
    #ball { max-width: 100px; } /* or whatever size you need. */ 
} 

Answer 2

Вы можете попробовать сделать свой собственный класс, а затем использовать точки останова подмешать Сасс, как это :::

.myImg { 
    img { 
    position:absolute; 
    left: 0px; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    @include respondto(phone, tablet) { 
    min-width:30px; 
    max-width:50px;} 

Просто измените параметры на то, что вам это нужно, чтобы быть.