-moz-image-region

Не стандартизовано: Це — нестандартний функціонал, і стандартизувати його ніхто не планує. Його не слід використовувати на вебсайтах у відкритому вебі, оскільки він не буде працювати для всіх користувачів. Також можливі суттєві (і часто — несумісні) відмінності між реалізаціями, а поведінка може змінитися у майбутньому.

Для певних XUL елементів та псевдоелементів, що використовують зображення із властивості list-style-image, ця властивість задає ділянку зображення, що використовується замість усього зображення. Це дає змогу елементам використовувати різні шматки одного й того ж зображення – для покращення швидкодії.

Синтаксис подібний до синтаксису властивості clip. Усі чотири значення відносні щодо верхнього лівого кута зображення.

Синтаксис

/* Ключове слово як значення */
-moz-image-region: auto;

/* <shape>-значення */
-moz-image-region: rect(0, 8px, 4px, 4px);

/* Глобальні значення */
-moz-image-region: inherit;
-moz-image-region: initial;
-moz-image-region: unset;

Значення

auto

Автоматично визначає ділянку зображення до використання.

<shape>

Форма, котра визначає частину зображення до використання. Функція rect() визначає прямокутник, що буде формою. Її параметри описують верхній, правий, нижній та лівий відступи від країв зображення, в такій послідовності.

Формальне визначення

Формальний синтаксис

 -moz-image-region =
   <shape> | auto

Приклади

Обрізання зображення

#example-button {
  /* показати лише зону 4-по-4 пікселі від верхнього лівого кута зображення */
  list-style-image: url("chrome://example/skin/example.png");
  -moz-image-region: rect(0px, 4px, 4px, 0px);
}
#example-button:hover {
  /* використати 4-по-4 зону  праворуч від попередньої, для кнопки, на яку наведено курсор миші */
  -moz-image-region: rect(0px, 8px, 4px, 4px);
}

Специфікації

Не є частиною жодного стандарту.

Сумісність із браузерами

desktop mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on iOS Samsung Internet
-moz-image-region
Нестандартне
Chrome No support Ні
Edge No support Ні
Firefox Full support 1
Internet Explorer No support Ні
Opera No support Ні
Safari No support Ні
WebView Android No support Ні
Chrome Android No support Ні
Firefox for Android Full support 4
Opera Android No support Ні
Safari on iOS No support Ні
Samsung Internet No support Ні

Дивіться також