Функсияи rotate
Функсияи rotate() гардонидани элементро
то завъяи муқарраршуда муайян мекунад. Ҳамроҳи
хосияти transform истифода мешавад.
Қимати хосият завъе дар ҳама гуна воҳидҳои
барои завъа мебошад. Қимати мусбат гардонданро
ба самти соат, манфӣ - зидди соат муайян мекунад.
Гардондан атрофи нуқтае, ки аз тарафи
хосияти transform-origin муқаррар карда мешавад, сурат мегирад.
Синтаксис
интихобкунанда {
transform: rotate(завъа);
}
Намуна
Дар ин намуна блок ба самти соат то 30
дарача гардонда шудааст:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Намуна
Дар ин намуна блок зидди самти соат то 30
дарача гардонда шудааст:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Намуна
Дар ин намуна блок ҳангом аз боло гузарондани курсор
1 маротиба гардонда мешавад,
зеро қимати гардондан дар 1turn муқаррар шудааст
(ҳамон таъсирро бо муқаррар кардани завъаи гардондан дар
360deg ба даст овардан мумкин аст). Барои
нафисатии гардондан хосияти
transition илова карда шудааст:
<div id="elem">lorem ipsum</div>
#elem {
border: 3px solid black;
width: 100px;
height: 50px;
transition: transform 3s linear;
}
#elem:hover {
transform: rotate(1turn);
}
:
