Mengatur Image Gambar

Sidebar memiliki ukuran yang berbeda-beda, untuk itu diperlukan penyesuaian terhadap beberapa bagiannya, antara lain :

Mengatur Ukuran Image/Gambar

<img style="border:0px; width:120px; height:50px;" src="URL image 1"/>

Mengatur Letak/Posisi Gambar (tinggal menambahkan) :

Tengah <center> kemudian ditutup dengan </center>
Kiri <left> kemudian ditutup dengan </left>
Kanan <right>kemudian ditutup dengan </right>

Contoh untuk penulisannya

<right><img style="border:0px; width:120px; height:50px;" src="URL image 1"/></right>

Mengatur Jarak

• Memberi Margin Atas Bawah

<img style="border:0px; width:120px; height:50px; margin-top:5px;" src="URL image 1"/>

Keterangan : Perintah margin-top:5px artinya bahwa gambar akan diberi margin ke atas dan ke bawah sebesar 3px

• Memberi Margin Atas Bawah - Kanan Kiri

<img style="border:0px; width:120px; height:50px; margin:3px 1px;" src="URL image 1"/>

Keterangan : Perintah margin-top:5px artinya bahwa gambar akan diberi margin ke atas dan ke bawah sebesar 3px, serta ke kanan dan ke kiri sebesar 1px


Contoh Penggunaannya :

<center>
<img style="border:0px; width:120px; height:50px; margin:3px 1px;" src="http://i831.photobucket.com/albums/zz233/qcux80/cooltext460118870.jpg"/>
<img style="border:0px; width:120px; height:50px; margin:3px 1px;" src="http://i831.photobucket.com/albums/zz233/qcux80/cooltext460118870.jpg"/>
<img style="border:0px; width:120px; height:50px; margin:3px 1px;" src="http://i831.photobucket.com/albums/zz233/qcux80/cooltext460118870.jpg"/>
</center>

Hasilnya : (atas-bawah)

Untuk yang kiri-kanan

<center>
<img style="border:0px; width:120px; height:50px; margin-top:5px;"src="http://i831.photobucket.com/albums/zz233/qcux80/cooltext460118870.jpg"/><img style="border:0px; width:120px; height:50px; margin-top:5px;"src="http://i831.photobucket.com/albums/zz233/qcux80/cooltext460118870.jpg"/>
<img style="border:0px; width:120px; height:50px; margin-top:5px;"src="http://i831.photobucket.com/albums/zz233/qcux80/cooltext460118870.jpg"/>
</center>

Preview nya :

Selamat Mencoba dan semoga berguna...!

Read more »