Membuat Garis Pada Blog (Style Border) – HTML

By | Januari 25, 2010

Membuat garis memakai kode HTML-Sering kita melihat pada blog orang lain yang tampilannya rapi dan tertata karena tulisannya menggunakan garis-garis atau bingkai. Istilah tepatnya menggunakan border pada tepinya. Nah disini ada beberapa macam variasi border (style border) dan ghalibnya para blogger menggunakan diantara 5 macam tampilan berikut :


ini adalah contoh tampilan dari dotted


Script aslinya yaitu:

<div style=”border: 3px dotted rgb(0, 0, 0); padding: 5px; background: rgb(242, 242, 242) none repeat scroll 0% 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;”>
ini adalah contoh tampilan dari dotted
</div>


Selain bergaya dotted, bisa dengan model dashed, double, solid, groove, ridge, inset dan outset (lihat gambar diatas)

selain memberi bingkai anda juga dapat menghias tulisan dengan memberikan kode warna sebagai background atau latar belakangnya. caranya juga sama yaitu anda tinggal memasukkan kode ini disebelum tulisan atau kode yang ingin anda beri bingkai dan kemudian tutup dengan kode pada akhir kata yang ingin diberi bingkai. berikut kode contohnyanya :

<div style=”padding: 5px; background: transparent url(http://i466.photobucket.com/albums/rr21/meeftha/NU.jpg) repeat scroll 0% 0%; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; width: 500px; height: 50px;”>
Tulis teks disini dan akan muncul background
</div>


Tampilannya :

Tulis teks disini dan akan muncul background


Ubah url gambar diatas sesuai url gambar pilihanmu yang dijadikan background.

Facebook Comments

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *