Настройка размера или пикселизации фонового изображения при ширине до 1080 пикселей до ширины мобильного телефона

Question

Я добавляю этот медиа-запрос, чтобы отрегулировать размер изображения, когда он идет с рабочего стола на мобильный, но он не соблюдается. Есть предположения?

@media (max-width: 768px) { 
 
    #team { 
 
    background-color: #fff; 
 
    background-image: #444 url('../img/womencoffee.jpg') center top no-repeat fixed; 
 
    } 
 
}

Когда я иду на это смотреть, это все еще действительно взрывают мое изображение на версию мобильного телефона.

См раздел сайта: nonprofit section

Answer 1

Вы проблема вращается вокруг поставки несоответствующих параметров ваших свойств CSS.

В связи обеспечивают запрос СМИ:

@media (max-width: 768px) { 
    background-color: #999999; 
    background-image: image-url('http://placekitten.com/g/500/768'); 
} 

Это один не работает, потому что image-url() должен быть url().

В коде, представленной выше, вы должны:

@media (max-width: 768px) { 
    background-color: #fff; 
    background-image: #444 url('http://placekitten.com/g/500/768') center top no-repeat fixed; 
} 

Здесь поставляют несколько параметров background-image, который принимает только один параметр, url(). Я думаю, вы искали свойство background, которое позволяет сразу установить несколько свойств фона.

Изменение background-image до background работ. Как только вы сделаете это изменение, background-color станет излишним, поскольку вы переопределяете его с помощью #444.