Что такое CSS-спрайты

Ответ

Спрайт — это изображение, содержащее несколько графических элементов (иконки, кнопки и т.д.), объединённых в один файл. Используется для оптимизации загрузки, уменьшая количество HTTP-запросов.

Пример использования в CSS:

.icon {
  background-image: url('sprite.png');
  background-repeat: no-repeat;
  width: 32px;
  height: 32px;
}

.icon-home {
  background-position: 0 0;
}

.icon-settings {
  background-position: -32px 0;
}

Преимущества:

Меньше запросов к серверу
Ускорение загрузки страницы
Удобство управления графикой

Недостатки:

Сложность обновления (нужно пересобирать спрайт)
Избыточность, если используются не все элементы