Cвойство transform используем, когда нам нужно применить к элементу какие-либо трансформации: искажение, поворот, смещение, масштабирование. Часто бывает необходимо каким-то образом трансформировать визуальное представление элемента (масштабировать, повернуть, переместить) и при этом никак не затронуть соседние элементы в документе. Для подобных преобразований используется свойство transform. В качестве значения выступают различные функции трансформации: rotate, translate, scale, skew.
transform հատկությունն օգտագործվում է այն դեպքում, երբ մենք պետք է որևէ տարրի վրա կիրառենք փոխակերպումներ՝ թեքել, պտտել, տեղաշարժել, մասշտաբավորել: Հաճախ անհրաժեշտ է լինում ինչ-որ կերպ փոխակերպել տարրի տեսողական պատկերը (մասշտաբավորել, պտտել, շարժել)՝ առանց փաստաթղթի հարևան տարրերի վրա ազդելու: Նման փոխակերպումների համար օգտագործվում է transform հատկությունը։ Փոխակերպման տարբեր գործառույթներ հանդիսանում են որպես արժեք՝ rotate, translate, scale, skew:
Синтаксис
Գրելաձև
transform: matrix(1.0, 2.0, 3.0);
transform: perspective(17px);
transform: rotate(0.5turn);
transform: translate(12px, 50%);
transform: scale(2, 0.5);
transform: skew(30deg, 20deg);
Пример
Օրինակ
⇓Результат данного примера показан на рисунке⇓
⇓Այս օրինակի արդյունքը ցույց է տրված նկարում⇓
| Browser | IE | Edge | Chrome | Firefox | Safari | Opera |
|---|---|---|---|---|---|---|
| Version | 10+ | 12+ | 36+ | 16+ | 9+ | 23+ |
| Notes |