skewX ფუნქცია
skewX ფუნქცია ახდენს ელემენტის დახრას
X ღერძის მიმართ, რითაც ის პარალელოგრამად გარდაიქმნება.
გამოიყენება transform თვისებასთან ერთად.
თვისების მნიშვნელობაა კუთხე ნებისმიერ კუთხურ ერთეულში.
კუთხე შეიძლება იყოს დადებითიც და უარყოფითიც.
დადებითი მნიშვნელობა ახდენს დახრას მარცხნივ, უარყოფითი - მარჯვნივ.
დახრა ხდება იმ წერტილის გარშემო, რომელიც მითითებულია
transform-origin თვისებით.
სინტაქსი
არჩევანი {
transform: skewX(კუთხე);
}
მაგალითი
ამ მაგალითში ბლოკი დახრილია 30
გრადუსით მარცხნივ:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewX(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
მაგალითი
ამ მაგალითში ბლოკი დახრილია 30
გრადუსით მარჯვნივ:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewX(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
: