Лучшее руководство по CSS3 преобразования происхождения недвижимость в 2024 году. В этом руководстве вы можете изучить примеров,Поддержка браузеров,Определение атрибута и инструкции,грамматика,
CSS3 преобразования происхождения недвижимость
примеров
Установить положение точки поворотные элементы:
{
transform: rotate(45deg);
transform-origin:20% 40%;
-ms-transform: rotate(45deg); /* IE 9 */
-ms-transform-origin:20% 40%; /* IE 9 */
-webkit-transform: rotate(45deg); /* Safari and Chrome */
-webkit-transform-origin:20% 40%; /* Safari and Chrome */
}
Попробуйте »
Поддержка браузеров
Цифры в таблице представляют первый браузер для поддержки номер версии имущества.
Сразу же после цифровой -webkit-, -ms- или -moz- назад в поддержку префикса атрибута первый номер версии браузера.
| 属性 | |||||
|---|---|---|---|---|---|
| transform-origin (two-value syntax) |
36.0 4.0 -webkit- |
10.0 9.0 -ms- |
16.0 3.5 -moz- |
9.0 3.2 -webkit- |
23.0 15.0 -webkit- 10.5 -o- |
| transform-origin (three-value syntax) |
36.0 12.0 -webkit- |
10.0 | 16.0 10.0 -moz- |
9.0 4.0 -webkit- |
23.0 15.0 -webkit- |
Определение атрибута и инструкции
спектрально-Origin атрибут позволяет изменять положение элемента преобразования.
преобразовательные элементы 2D можно изменить X и Y-оси элементов. преобразовательный элемент 3D, вы можете также изменить элемент Z-оси.
Чтобы лучше понять атрибут Transform происхождения, пожалуйста , см демонстрационный пример .
Примечание: Это свойство необходимо сначала преобразовать свойство.
Совет: Пользователи Safari / Chrome:Для того, чтобы лучше понять 3D - преобразования свойств, смотрите демо .
| По умолчанию: | 50% 50% 0 |
|---|---|
| Наследование: | нет |
| Версия: | CSS3 |
| Синтаксис JavaScript: | объект .style.transformOrigin = "20% 40%" |
грамматика
| значение | описание |
|---|---|
| ось х | Пользовательские View находится там, где ось Х. Возможные значения:
|
| Y-ось | Пользовательский вид помещается где Y-ось. Возможные значения:
|
| ось г | Пользовательский вид помещается где Z-оси. Возможные значения:
|
