Pages

Ads 468x60px

Minggu, 25 Oktober 2009

Otak-atik posting gambar

Posting yang berwujud gambar mempunyai tingkat kesulitan yang lebih bila dibandingkan dengan posting dalam bentuk teks. Gambar atau photo yang diberikan oleh blogger.com dalam bentuk KODE yang kita terima dalam ruangan posting di mode POSTING-EDIT HTML sebenarnya sudah sangat lengkap , tinggal bagaimana kita mengolah kode tersebut sehingga mejadi bentuk gambbar yang sesuai dengan keinginan kita. Baik ukuran gambar, posisi ataupun bagaimana kita memperindah tampilan gambar tersebut. Sebagai contoh akan saya berikan satu KODE HTML dari gambar yang diberikan blogger.com :


<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi59cRxf__qn_NZk0kWrl7zq-8yCGS-O2J8pXy_NdsFWvRI24OsF-fLOLHTqFSEUhQG7z2ur_hy3ppQc12loGPM0oeH4cA7WEZaaMDXcZzt7USQXbMuK0pisgdkjqteCrlVLQNyIT0AtAg/s1600-h/GRregiistfeedb4.jpg"><img style="float:left; margin:0 10px 10px 0;cursor:pointer; cursor:hand;width: 200px; height: 190px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi59cRxf__qn_NZk0kWrl7zq-8yCGS-O2J8pXy_NdsFWvRI24OsF-fLOLHTqFSEUhQG7z2ur_hy3ppQc12loGPM0oeH4cA7WEZaaMDXcZzt7USQXbMuK0pisgdkjqteCrlVLQNyIT0AtAg/s200/GRregiistfeedb4.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5396264114716979762" /></a>

1. KODE warna ORANYE : apabila hendak menampilkan gambar di sebelah kanan dan saat "UNGGAH GAMBAR" terlanjur di kiri, maka anda bisa merubah KODE :

- float:left; menjadi float:right; ---> posisi gambar di kanan
- text-align: center; margin:0 auto 10px;display:block; ---> untuk posisi di tengah
- float:left;dan margin:0 10px 10px 0; di hilangkan ---> posisi bebas

2. KODE warna Hijau :

- KODE s1600-h mempunyai maksud : bila gambar di buka maka akan tampil di pojok kiri atas.
- Dengan menggantinya menjadi s400, maka gambar akan tampil di tengah layar monitor.

3. KODE warna merah :

- 0 10px 10px 0 menyatakan margin atas, kanan, bawah dan kiri. Bisa anda sesuaikan dengan kebutuhan posting. Jarak tersebut dalam nilai pixel dan merupakan jarak antara segala sesuatu yang ada di sebelah atas, kanan, bawah atau kiri gambar tersebut.

4. KODE warna KUNING :

- berfungsi untuk merubah ukuran gambar, baik memperkecil ataupun memperbesar.
- Width=lebar/panjang gambar dan height=tinggi gambar (nilai dalam pixel atau px)
- Apabila nilai diperbesar, maka gambar bertambah besar. Begitu juga sebaliknya.

5. KODE warna BIRU :

- Border atau gampangnya garis bingkai gambar. Bisa dirubah besarannya dan bisa ditambahkan warna border yang sesuai dengan menambahkan KODE border-color:...; setelah KODE float:left;
- titik-titik bisa diisi dengan warna red, yellow, blue atau warna lain dan juga bisa di isi dengan warna, dalam KODE yang berbentuk angka dengan menambahkan tanda pagar di depannya. Contoh : border-color:#83cdd0;

Semoga bermanfaat !!!

0 komentar:

Posting Komentar