Изменить размер изображения

Я хотел бы изменить размер sprited background-image. Моя картинка-спрайт возвращает после спрайта (?) Изображение размером 8px*8px. Я хотел бы изменить его размер до 80px*80px. Я не могу изменить размер всей картинки, потому что она находится на внешнем сервере.

Мой код:

.mc-skin{
  background: url('https://s3.amazonaws.com/MinecraftSkins/TupidaMC.png') -8px -8px;
  background-repeat: no-repeat;
  width: 8px;
  height: 8px;
}

Есть ли способ изменить размер фонового изображения? Я надеюсь, что объяснил свою проблему достаточно хорошо...

JsFiddle: http://jsfiddle.net/WL7HK/1/

1 ответ

Вы могли бы использовать background-size: 640px 320px для этого, и он уже имеет достойную поддержку браузера.

Пример:

.mc-skin{
  background: url('https://s3.amazonaws.com/MinecraftSkins/TupidaMC.png');
  background-repeat: no-repeat;
  background-size: 640px 320px;
  background-position: -80px -80px; /* adjusted for increased size */
  width: 80px;
  height: 80px;  
  display: block;
  image-rendering: -moz-crisp-edges;         /* Firefox */
  image-rendering:   -o-crisp-edges;         /* Opera */
  image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
  image-rendering: crisp-edges;
  -ms-interpolation-mode: nearest-neighbor;  /* IE (non-standard property) */
}

Скрипка: http://jsfiddle.net/WL7HK/4/

Другие вопросы по тегам