Membuat Variasi Bingkai

Banyak cara yang bisa kita ciptakan agar link atau banner maupun gambar kita menjadi menarik untuk dilihat oleh visitor yang berkunjung ke blog kita. Salah satunya adalah membuat link, banner ataupun gambar tersebut kita hiasi dengan bingkai / frame. Kali ini saya akan mengulas cara menambahkan bingkai tersebut pada gambar atau link dan banner yang anda inginkan.

Sampai saat ini saya hanya mempunyai 4 buah variasi bingkai saja yang bisa saya tulis dalam artikel ini. Silahkan anda coba praktekkan keempat bingkai di bawah ini ke dalam blog anda.

1. Bingkai berupa garis lurus, silahkan copy script berikut

<div style="overflow:no; width:100%px; height:100%px; border:6px solid #00FFFF; padding: 5px;"><img border="0" src="http://img195.imageshack.us/img195/4945/pinginbelajar.gif"></div>

Maka hasilnya akan seperti di bawah ini

2. Bingkai berupa titik-titik, silahkan copy script berikut

<div style="overflow:no; width:100%px; height:100%px; border:6px dotted #00FFFF; padding: 5px;"><img border="0" src="http://img195.imageshack.us/img195/4945/pinginbelajar.gif"></div>

Maka hasilnya akan seperti di bawah ini

3. Bingkai berupa garis putus-putus, silahkan copy script berikut

<div style="overflow:no; width:100%px; height:100%px; border:6px dashed #00FFFF; padding: 5px;"><img border="0" src="http://img195.imageshack.us/img195/4945/pinginbelajar.gif"></div>

Maka hasilnya akan seperti di bawah ini

4. Bingkai berupa garis double, silahkan copy script berikut

<div style="overflow:no; width:100%px; height:100%px; border:6px ridge #00FFFF; padding: 5px;"><img border="0" src="http://img195.imageshack.us/img195/4945/pinginbelajar.gif"></div>

Maka hasilnya akan seperti di bawah ini

Script yang perlu anda edit adalah :

1. Script border:6px menyatakan ketebalan bingkai, silahkan ganti digit 6 dengan digit yang anda inginkan
2. Script 00FFFF menyatakan warna bingkai, silahkan ganti dengan warna yang anda inginkan. Untuk mendapatkan kode warna silahkan surfing di sini html-color-codes
3. Script padding:5px menyatakan jarak antara objek dengan bingkai, silahkan ganti digit 5 dengan digit yang anda inginkan
4. Silahkan ganti script http://img183.imageshack.us/img183/4945/pinginbelajar.gif dengan script objek yang anda miliki
5. Selesai

Selamat mencoba, semoga bermanfaat