Как сделать, чтобы картинка была по центре и обрезалась лишь разрешением монитора?

Question

[Forleyn]

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

Answer 1

[Александр Таратин]

htmlbook.ru/css/background-size (значение cover)
htmlbook.ru/css/background-position

Comments

[Forleyn]

cover масштабирует к блоку, position тоже.. А мне нужно, чтобы картинка была просто посередине, а так как применяется бэкграунд к блочному элементу, то чтобы обрезалась она в зависиомсти от разрешения экрана. Представьте, чтоы там по середине нужная линия, а далее в стороны допустим на 3000 пикселей в стороны идет градиент и мне надо , чтобы на любом разрешение линия была посередине, а если разрешение больше, то пользователь просто видет больше градиента.

[Максим Софронов]

Forleyn: а разве просто background-position: 50% не подходит?

[Forleyn]

maxsof: вы правы, давно не верстал и неправильно запомнил действие background position в процентах, спасибо

Answer 2

[Mikhail Osher]

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

Comments

[Максим]

Для cover нужно ещё webkit moz прописать, чтобы везде работал.