После добавления фонового изображения осталось пустое пространство. когда Б.Г. размер изменяется на «крышке» во время повторной калибровки с малым разрешением есть осталось пустое пространство, пожалуйста, проверьте себя codepenФоновое изображение для повторного калибровки
body {
margin:0;
background-image:url('http://www.fg-a.com/wallpapers/yellow-flowers-green.jpg');
background-repeat: no-repeat;
background-size:auto;
}
Если вы хотите, чтобы ваши background-image, чтобы покрыть весь <body>, используйте
body {background-size: cover;}
Если вы хотите, чтобы ваш <body>, чтобы покрыть весь vieport (окно браузера), добавьте это правило (для <body>):
min-height: 100vh;
Вопреки распространенному мнению, высота <body> ограничена высотой содержимого и не расширяется до полной высоты окна браузера.
I Got It Спасибо Andrei.How 100vh работами могли бы вы помочь? – akash
'100vh = высота видового экрана. Итак, '1vh = 1% высоты просмотра. Высота Vieport означает высоту браузера (без кнопок и области вкладок, конечно - только окно просмотра). И '100vw = ширина видового экрана. –
спасибо, да, я думаю, что проблема заключалась в том, чтобы не обеспечивать высоту после добавления ширины и высоты 100% к телу и html.it в порядке – akash
У вас есть background-size:cover;, но ...
у вас просто отсутствует свойство background-position.
Самый простой способ, как:
html, body{
height:100%; /* Don't forget to set html and body to height 100%! */
}
body {
margin: 0;
background: url('green.jpg') 50%; /* where 50% is our background-position (center) */
background-size: cover;
}
, что на самом деле все, что вам нужно.
http://jsbin.com/bogacad/1/edit?html,css,output
https://developer.mozilla.org/en-US/docs/Web/CSS/background-position
B тщательные некоторые браузеры имеют проблемы с CSS фоном размера, как Mozilla –