Join this site

Cara Memiringkan Ojek Di Template

Hallo Pengunjung Setia Dedi Sinaga . Kali ini saya akan share trick blogger dari 
monster-shared yaitu "CARA MEMIRINGKAN OBJEK DI TEMPLATE"

langsung aja




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
gimana langsung di coba sekarang..


sumber : monster-shared

5 komentar:

  1. Wah Infonya Sangat Menarik bagi saya
    tolong di comment back at : http://reza-jkt48.blogspot.com/

    BalasHapus
  2. Tukeran banner 88x31 yuk sob?
    http://sky-street.blogspot.com/2013/06/banner-skystreet-update.html

    BalasHapus
  3. nice post gan..

    komen back yah.. :D

    BalasHapus

[D-S] COMMENTS RULE :

-DONT SPAM
-DONT FLOOD
-BILA ANDA SUKA DENGAN ARTIKEL INI SILAHKAN BERKOMENTAR
-BILA ANDA INGIN MENDAPATAKAN INFO DI BLOG INI SILAHKAN FOLLOW BLOG INI
-GUNAKANLAH BAHASA YANG SOPAN
-FOLLOW THIS BLOG I WILL FOLLOWBACK !!

 
Thanks For Visiting Gunakanlah Google Chrome Untuk Tampilan Sempurna