-webkit-mask-position-x

Свойство -webkit-mask-position-x задает позицию маски элемента по горизонтальной оси относительно точки, указанной в -webkit-mask-origin.

В качестве маски может быть использовано любое изображение, причем прозрачные части маски делают элемент невидимым, непрозрачные — видимым, а полупрозрачные — полупрозрачными в зависимости от прозрачности маски.

Допустимые значения

  • <процент> — задает расположение маски в процентных значениях по горизонтальной оси.
  • <значение> — задает расположение маски в единицах измерения по горизонтальной оси.
  • left = 0% (выравнивается по горизонтали по левой строне)
    center = 50% (выравнивается по горизонтали по центру)
    right = 100% (выравнивается по горизонтали по правому краю)
  • inherit — наследует значение от родителя
Значение по умолчанию 0%
Применимо ко всем элементам
Наследование нет
Поддерживается браузерами
  • Safari 4.0 и выше
  • Chrome 3.0 и выше

Пример

CSS
div {
background-color:#ccc;
-webkit-mask-image:-webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)))
-webkit-mask-position-x: right;
}

По теме