2015-10-28 3 views
2

Послеобеденного Стек переполнение,OpenCart фонового изображения/цвет ошибка

Моя проблема с моей веб-сайтом here

я использую модуль для фонового изображения, которое работает отлично на настольных компьютерах и IPADS, Когда мобильный пользователь просматривает веб-сайт, фоновое изображение, которое максимируется на 4000 пикселей и отображает вместо него белый фон. Я связал исправления @media, но не повезло. Единственное исправление, которое я обнаружил, накладывает область содержимого, удаляет эффект капания вверху.

Device comparison

Еще раз спасибо, Стивен

ответ

0

Решение: 1- Дайте background:#000; к body в мобильной ситуации (медиа запросов)

body { 
    background: url('http://www.vapescotts.co.uk/image/catalog/Background_Img/background_black.png') no-repeat center top #000 !important; 
} 

2-Дайте background-size: cover !important; на body в мобильном телефоне ситуация (медиа-запрос)

body { 
    background: url('http://www.vapescotts.co.uk/image/catalog/Background_Img/background_black.png') no-repeat center top #000 !important; 
background-size: cover !important; 
} 
0

Вы могли бы просто дать

#content { background-color:#000; padding-bottom:30px; } 

и удалить

footer { margin-top:30px; } 

дает тот же визуальный эффект, как если бы изображение было покрыто все.

+0

Спасибо, что сработал, Чтобы сэкономить на обрезке, я добавил 20px в поле #content. Еще раз спасибо – Steven

+0

Нет проблем – Matt

0

Ваш фон просто не реагирует, что это вопрос here.I предлагает попробовать исправить ваш Backgound изображения

background: url(http://www.vapescotts.co.uk/image/catalog/Background_Img/background_black.png) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 

Попробуйте положить это на вашем сайте Как вы можете видеть, что это поднимает имидж и его отзывчивый и все в фоновом режиме является отзывчивым. Просто поиграйте с фоновое изображение сделать его меньше, так как его разрезая способами от верхней части к нижней

EDIT:

Ваше изображение является 1920x4252, сделать это 1920х1080 или нечто подобное.

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