Справочник по CSS : Тематический указатель : Расширения CSS для Firefox (Gecko) : Свойства : -moz-transform-origin

смотрим также

Материал из Справочник Web-языков

Перейти к: навигация, поиск


Содержание

Свойство -moz-transform-origin

Используется при определении точки отсчета для применения трансформации к элементу. Например, при повороте rotate по умолчанию точкой отсчета будет центр элемента.

Синтаксис

-moz-transform-origin: [ <percentage> | <length> | left | center | right ] [ <percentage> | <length> | top | center | bottom ] ?

-moz-transform-origin: [ left | center | right ] || [ top | center | bottom ]

Используемые значения

  • Если задано одно значение, то оно задает горизонтальную координату точки отсчета, а вертикальной координате по умолчанию задается значение 50%.
  • Если задано два значения, то первое - для горизонтальной координаты, второе - для вертикальной.

Поддерживаются комбинации из ключевых слов (указаны ниже), значений длины и процентов. Если ключевые слова используются в сочетании с другими значениями, то left и right могут использоваться только как первое значение (для горизонтальной координаты), а top и bottom - как второе значение (для вертикальной координаты). Поддерживаются отрицательные значения.

<percentage>
Если задана пара значений 0% 0% или просто 0 0, то точкой отсчета выбирается левый верхний угол элемента. Если задана пара значений 100% 100%, то точкой отсчета выбирается правый нижний угол. А, например, с парой значений 14% 84%, отсчет для трансформации начнется от точки 14% вправо и 84% вниз от левого верхнего угла элемента.
<length>
Если задана пара значений, например, 2cm 1cm, то точка начала трансформации будет находиться на 1 сантиметр правее и на 2 сантиметра ниже левого верхнего угла элемента.
top left | left top
Тоже самое, что и 0 0.
top | top center | center top
Тоже самое, что и 50% 0.
right top | top right
Тоже самое, что и 100% 0.
left | left center | center left
Тоже самое, что и 0 50%.
center | center center
Значение по умолчанию. Тоже самое, что и 50% 50%.
right | right center | center right
Тоже самое, что и 100% 50%.
bottom left | left bottom
Тоже самое, что и 0 100%.
bottom | bottom center | center bottom
Тоже самое, что и 50% 100%.
bottom right | right bottom
Тоже самое, что и 100% 100%.

Значением по умолчанию является 50% 50%. Атрибут Каскадных таблиц стилей (CSS) не наследуется.

Замечания

Свойство -moz-transform-origin применяется ко всем блочным и встроенным элементам.

Примеры

В примере показано как описать свойство -moz-transform-origin:

-moz-transform: rotate(30deg);
-moz-transform-origin: 0 0;

Используя браузер Mozilla Firefox (Gecko) 3.5 (1.9.1) посмотрите Примеры (Live examples).

Поддерживаемые браузеры

Firefox (Gecko) начиная с версии 3.5 (1.9.1) - для свойства -moz-transform-origin.

Opera начиная с версии 10.5 - для свойства -o-transform-origin.

Safari (WebKit) начиная с версии 3.1 (525) - для свойства -webkit-transform-origin.

Стандарты

CSS3 2D Transforms #transform-origin

Смотрите также

-moz-transform

Ссылки на источники

https://developer.mozilla.org/En/CSS/-moz-transform-origin

Добавить страницу в закладки:
РАЗРЕШАЕТСЯ перепечатывать и копировать информацию ТОЛЬКО ПРИ РАЗМЕЩЕНИИ ссылки на оригинал!
(<A href="https://www.spravkaweb.ru/">Справочник Web-языков</A>)
другие проекты
Rambler\'s Top100 Индекс цитирования