Фон всегда заполняет окно браузера, даже в мобильных браузерах?

Я попробовал ответы в разделе Растянуть и масштабировать фон CSS (а также http://css-tricks.com/3458-perfect-full-page-background-image/), и он прекрасно работает в Firefox и Chrome, но оба метода ошибка в браузере Android. Оба метода терпят неудачу одинаково: когда я прокручиваю вниз, фон остается позади, поэтому я получаю белый фон. (Вы можете увидеть проблему, просмотрев эту страницу в браузере Android: http://css-tricks.com/examples/FullPageBackgroundImage/progressive.php)

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

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

Версия Android 2.2.1, встроенный браузер webkit.

Поведение Opera Mobile отличается от других, но также неправильно: при прокрутке происходит задержка в полсекунды, после чего фон переходит. Но также фон заполняет только около 80% высоты, поэтому в верхней или нижней части экрана есть белый блок. (Это решение "img на более низком z-index"; решение css3 background-size вообще не работает на Opera Mobile.)

1 ответ

Вы пробовали собственность СМИ в css.

Её ссылка

CSS3 Media Queries

Вы можете использовать разные CSS в зависимости от разрешения экрана

Другие вопросы по тегам