Обрезать / обрезать фоновое изображение с помощью CSS

У меня есть этот HTML:

<div id="graphic">lorem ipsum</div>

с этим CSS:

#graphic { background-image: url(image.jpg); width: 200px; height: 100px;}

Фоновое изображение, которое я применяю, имеет размер 200x100 пикселей, но я хочу только отображать обрезанную часть фонового изображения размером 200x50 пикселей.

background-clip , похоже, не является подходящим свойством CSS для этого. Что я могу использовать вместо этого?

background-position не следует использовать, потому что я использую приведенный выше CSS в контексте спрайта, где часть изображения, которую я хочу показать, меньше, чем элемент, на котором находится CSS определенный.

67
задан TRiG 28 January 2014 в 15:42
поделиться