Как сделать background на весь экран документа?

Question

[Олег Володин]

Ребят, подскажите как сделать background на весь экран документа. Т.е. есть картинка и ее нужно растянуть на весь документ?

P.S.
И подскажите как можно более менее грамотно нарезать картинку для такого background'а.

Comments

[Константин Гулла]

Link
Вы это смотрели ??

[Олег Володин]

Конечно смотрел, прежде чем писать сюда.

[Константин Гулла]

@drondo как я понял у тебя есть картинка и ты её хочешь поставить на фон сайта ?

[Олег Володин]

Да, смысл такой, чтобы картинка заполняла весь фон. Вопрос скорее по дизайну, потому что не понимаю как грамотно нарезать такую картинку.

[Константин Гулла]

@drondo картинку резать не надо в css есть сжатие картинок под размер экрана, а код щас поищу.

Answer 1

[Никита Гуляев]

background-size: [ <значение> | <проценты> | auto ]{1,2} | cover | contain
<значение> - Задает размер в любых доступных для CSS единицах — пикселы (px), сантиметры (cm), em и др.
<проценты> - Задает размер фоновой картинки в процентах от ширины или высоты элемента.
auto - Если задано одновременно для ширины и высоты (auto auto), размеры фона остаются исходными; если только для одной стороны картинки (100px auto), то размер вычисляется автоматически исходя из пропорций картинки.
cover - Масштабирует изображение с сохранением пропорций так, чтобы его ширина или высота равнялась ширине или высоте блока.
contain - Масштабирует изображение с сохранением пропорций таким образом, чтобы картинка целиком поместилась внутрь блока.

Answer 2

[begezavr]

html { 
        background: url('images/yourimage.jpg') no-repeat center center fixed; 
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
}

Answer 3

[Назар Мокринский]

При возникновении подобных вопросов заходите на htmlbook.ru, и смотрите всё, что начинается с background в разделе справочника CSS.
Это сэкономит время и вам, и нам.

Answer 4

[JakBack]

Спасибо!