Одновременное использование всех видов трансформации

Одновременное использование всех видов трансформации.

Иногда возникает необходимость одновременно применить к элементу несколько трансформаций. Для того чтобы получить составное свойство transform, нужно всего лишь разделить функции пробелом.

Очень важно помнить о том, что порядок перечисления функций играет огромную роль. Некоторые функции передвигают точку отсчета и центр объекта, изменяя таким образом параметры, с которыми будут работать функции, перечисленные далее.

Листинг 3.24. Перемещение, масштабирование и поворот элемента: трансформации определяются в одной строке

#mainbox {

Display: block; width: 500px; margin: 50px auto; padding: 15px; text-align: center; border: 1px solid #999999; background: #DDDDDD;

-moz-transform: translateY(100px) rotate(45deg) scaleX(0.3); — webkit-transform: translateY(100px) rotate(45deg) scaleX(0.3);

}

Замените кодом из листинга 3.24 соответствующий код в листинге 3.11 и проверьте результат в своем браузере.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *