размера фона для мобильных устройств

Question

Я пытаюсь сделать фоновое изображение для мобильных устройств, таких как:

body { 
    background: url("/resources/img/background2.jpg") no-repeat fixed; 
    -webkit-background-size: 100%; 
    -moz-background-size: 100%; 
    -o-background-size: 100%; 
    background-size: 100% 100%; 
} 

В инструментах разработчиков Chrome это выглядит красиво, но на реальное устройстве (с меньшим размером экрана) Это не. Почему это и как я могу решить эту проблему?

Фотосъёмка:

Answer 1

Вы хотите отзывчивый фоновое изображение, которое можно получить уменьшенную на смартфонах. Используйте это:

background-image:url('/resources/img/background2.jpg'); 
-webkit-background-size: 100%; 
-moz-background-size: 100%; 
-o-background-size: 100%; 
background-size: 100%; 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 

Answer 2

Как насчет?

background-image: url("/resources/img/background2.jpg"); 
background-repeat: no-repeat; 
background-size: cover; 
background-position: center center;