Cara Memiringkan Objek Di Template

Skew Technique

Publishing with Monster-Shared.blogspot.com

Ass. Hey para Monster, baiklah langsug Oke langsung to point aja ya. Baiklah cekibrother.............

Untuk membuat suatu objek miring sebenarnya sangat gampang tinggal menambahkan kode dibawah ini di dalam CSS objek tersebut.

;transform: skewX(*deg);

-webkit-transform: skewX(*deg);

-ms-transform: skewX(*deg);

-moz-transform: skewX(*deg);

-o-transform: skewX(*deg);

}

NB :

Ganti tanda (*) dangan angka tergantung seleramu berapa derajat.

Namun yang bikin susah yaitu jika sobat tidak dapat pakai kreatifitas, hmm oke akan kujelaskan teknik skew ini, untuk membuat objek miring terdapat berbagai banyak bentuk seperti yang di bawah ini dan pelajari caranya ...

Yang ini namanya SkewX jangan heran dengan katanya X itu maksudnya rotasi atau arah kemiringan objeknya. SkewX ini arahnya yaitu Horizontal ,seperti arah kiri atau kanan.seperti yang diatas untuk membuat ini tinggal menambahkan kode seperti dibawah ini di dalam CSS objek tersebut

;transform: skewX(*deg);

-webkit-transform: skewX(*deg);

-ms-transform: skewX(*deg);

-moz-transform: skewX(*deg);

-o-transform: skewX(*deg);

}

Jika anda ingin membuat objek miring berlawanan arah tinggal menambahkan (-) di belakang derajat gini skewX(-*deg);

Ini namanya skewY seperti halnya skewX namun arahnya bberbeda.arah skew ini Vertikal gerak atas bawah berbada dengan skewX geraknya kiri kanan dan untuk menggunakan ini tinggal menambahkan kode CSS di bawah ini kedalam CSS objek yang ingin di buat miring

;transform: skewY(*deg);

-webkit-transform: skewY(*deg);

-ms-transform: skewY(*deg);

-moz-transform: skewY(*deg);

-o-transform: skewY(*deg);

}

Agarlebihmudah membuat arah sebaliknya. Seperti diatas tadi tinggal menambahkan (-)dibelakang derajat.

;transform: skewY(-*deg);

-webkit-transform: skewY(-*deg);

-ms-transform: skewY(-*deg);

-moz-transform: skewY(-*deg);

-o-transform: skewY(-*deg);

}

Kode ini berlaku untuk semua objek di template seperti kata, border, dsb. Termasuk juga gambar seperti gambar berikut;

Sebelum memberikan efek Skew

Setelah memberikan efek skew

Dengan CSS ini kadang terlihat indah bila di kreasikan dengan beberapa objek lain

kalo ada yang belum dimengerti atau ada yang belum diatanyakan, langsung aja koment dibawah