Menyusun gambar saat posting adalah satu perkara yang menyukarkan kerana kebiasannya gambar akan berada dibawah. Kalau dapat diletak sebelah menyebelah tentulah nampak lebih kemas dan menjimatkan ruangan.Sebagai contoh seperti gambar dibawah ini:
Kebiasaanya akan jadi seperti ini tersusun menjadi tiga baris.
untuk mengubahnya kita perlu masuk ke mode edit HTML
Dari compose klik pada mode edit HTML dan akan terpapar kode seperti dibawah :
Hasilnya:
<div style=”float: left;”>
<a href=”http://yahaya8527.files.wordpress.com/2010/12/images2.jpeg?w=205″ imageanchor=”1″ style=”clear: left; float: left; margin-bottom: 1em; margin-right: 1em;”><img border=”0″ src=”http://yahaya8527.files.wordpress.com/2010/12/images2.jpeg?w=205″ /></a></div>
</div>
Tambahkan kode warna hijau pada kode gambar seperti diatas<a href=”http://yahaya8527.files.wordpress.com/2010/12/images2.jpeg?w=205″ imageanchor=”1″ style=”clear: left; float: left; margin-bottom: 1em; margin-right: 1em;”><img border=”0″ src=”http://yahaya8527.files.wordpress.com/2010/12/images2.jpeg?w=205″ /></a></div>
</div>
<div style=”float: left;”>
<a href=”http://yahaya8527.files.wordpress.com/2010/12/imagesd.jpeg?w=161″ imageanchor=”1″ style=”clear: left; float: left; margin-bottom: 1em; margin-right: 1em;”><img border=”0″ src=”http://yahaya8527.files.wordpress.com/2010/12/imagesd.jpeg?w=161″ /></a></div></div>
<div style=”float: left;”>
<a href=”http://yahaya8527.files.wordpress.com/2010/12/flower.jpg” imageanchor=”1″ style=”clear: left; float: left; margin-bottom: 1em; margin-right: 1em;”><img border=”0″ height=”200″ src=”http://yahaya8527.files.wordpress.com/2010/12/flower.jpg?w=300″ width=”200″ /></a></div></div>
<div style=”clear: both;” /> <div/>Hasilnya:
Jika gambar turun juga kebawah(ukuran melebihi ruang) letak atau ubah saiz gambar pada kode.Kalau tak ada pada kode kena tambah seperti dibawah.Perhatikan juga pada kode kadang kadang dah ada(kena periksa jgn ada kode lebih 
) :
) :<a href=”http://yasiranak252.blogspot.com/2010/12/flower.jpg” imageanchor=”1″ style=”clear: left; float: left; margin-bottom: 1em; margin-right: 1em;”><img border=”0″ src=”http://yahaya8527.files.wordpress.com/2010/12/flower.jpg?w=300″ height=”200” width=”200” /></a></div>
Gambar yang ada diatas tidak sama besar jadi dengan memasukkan width dan height jadi sama kedudukannya.
By : http://chikawap.blogspot.com
Makasih sob tips n ane langsung coba dech ilmunya dan ditunggu kunjungan baliknya
ReplyDeleteMakasih sob infonya untuk menyusun gambar tampak lebih rapi pada postingan n ditunggu kunjungan baliknya
ReplyDelete.separator{background:#e8ebf2;float:none;max-width:100%; height: auto; width: auto;margin:20px auto 10px;text-align:center !important}
ReplyDelete.separator img{max-width:75%; height: auto; width: auto;margin:25px 0 20px; padding:0;box-shadow: 0 0 5px 1px #bbb;border:5px solid #fff;text-align:center !important}