Tips membuat gambar miring

Kalau biasanya gambar yang terpasang di blog lurus kini gambar miring pun bisa diciptakan menggunakan kode css. Meskipun saya sendiri kurang suka dengan hal-hal yang miring tapi kalau untuk sekedar koleksi sekaligus buat sensasi maka kuberanikan diri untuk memajang fotoku di blog.

Tapi sayangnya ketika memasang kurasa sudah lurus ternyata masih miring juga. Maklumlah tak ada seorang pun membantu memasangkan gambar fotoku hingga akhirnya apa boleh buat biar pun gambarnya miring asal orangnya enggak ikut miring.  Lagian siapa yang mau bantuin masang lha wong waktunya tidur kok malah sibuk sendiri..(wkwkwk)

Baiklah langsung kepada pokok cerita,
Penulisan kode css untuk membuat gambar miring tersebut adalah sebagai berikut :

.miring {
-webkit-transform: rotate(-30deg);
-moz-transform: rotate(-30deg);
}

Cara penulisan Tagnya seperti ini:

<div class="miring">KODE GAMBAR</div>

Bila ingin memasukkan gambar miring ini ke dalam postingan blog maka penulisannya seperti berikut ini:

<style type="text/css">
.miring {
-webkit-transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
}
</style>

<div class="miring">
<img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjo_SYMwrhjRa_LLbpjKA9yCJuG2-htNJi-QvQ7P45HLolfnI-LdJIDf8cnmRYhXugnuSGxeRI8pYkn2STSwJDcDj8xGmQK9Q8ArPZYwnd4EbGmnyg5Ph5rm7YFeEGGNPyHPqEhpEwYsyE8/" width="245" /></div>

Bila diposting maka anda atau siapa saja akan menikmati gambar miring di postingan blog seperti yang ada pada halaman demo ini:
LIHAT DEMO

Catatan:
Kemiringan dapat diatur dengan cara merubah angka -10 dengan angka sesuai keinginan anda.

Salam blogger.