Рисунок под разное разрешение

[sGir]

Доброго времени суток.

Подскажите решение такой задачи. Верстка резиновая. В верстке есть рисунок шириной 1000px (при разрешении экрана 1280х1024). Как сделать, что бы при меньших разрешениях экрана (например, 1024х768), рисунок уменьшался по ширине(обрезался по краям до нужного размера)? Несколько файлов стилей сделать (и соответственно рисунков) и выбирать нужный файл в зависимости от разрешения? Или есть иные способы? Заранее благодарен.

[USF]

а чем вас масштабирование рисунка не устраивает?

img {
   max-width: 100%;
   height: auto;
   width: auto\9; /* ie8 */
}

[sGir]

Делал. Получается, только не то, что нужно. Получается так: рисунок обрезается справа. Мне нужно: чтобы рисунок обрезался немного слева , немного справа, оставалась бы центральная часть.

[npofopr]

Видимо вы не то делали. Потому как стили выше ничего никуда не обрезают, а масштабируют картинку.

[strange_atom]

sGir, Вы определитесь, что Вам нужно. Чтобы картинка тянулась или обрезалась. Для первого случая Вам выше написали, а для второго вот:

jsfiddle.net/mvnaJ/

Но Вы не сказали назначения этого рисунка, поэтому, возможно, мое решение и не подойдет в данном случае

[USF]

Делал. Получается, только не то, что нужно. Получается так: рисунок обрезается справа.

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