Sabtu, 01 September 2012

Cara Membuat Border Posting Pada Blog

Tips-cara membuat Border pada kalimat atau Script Kode pada postingan Blog kita. Kalimat atau script kode bisa tampil lebih jelas saat anda menambahkan Border pada karakter yang dipilih. Ini akan mempermudah dan memperindah tulisan anda dengan variasi warna yang berbeda. Mungkin anda sering menjumpai kode script yang diberi bordir atau dimasukkan ke dalam scrool border, dan jika anda ingin mencoba, membuat Border pada kalimat atau Script Kode pada postingan Blog, caranya cukup menambahkan kode seperti dibawah ini.




SOLID BORDER :

<div style="border: 3px #000099 solid; padding: 5px; background-color: #00FFCC; text-align: left"> GANTI DENGAN TEKS/SCRIPT KODE ANDA </div>


Anda bisa mengganti kode-kodenya sesuai keinginan.

Misal:
border: 3px #000099 solid; 3px adalah garis tepi border (sebesar 3px), bisa anda ganti. #000099 adalah kode warna dengan jenis border solid, bisa anda ganti.

5px; adalah jarak antara tulisan dengan tepian garis border yakni sebesar ( 5px ), semakin besar angka, maka jarak antara tulisan dengan garis tepi akan semakin renggang.

background-color:#00FFCC; adalah warna background border dengan kode ( #00FFCC)

text-align:left" mengatur perataan kalimat. left bisa diganti dengan center untuk rata tengah, atau right untuk sebelah kanan



Contoh kode:

DASH BORDER :
<div style="border: 3px #000099 dashed; padding: 5px; background-color: #00FFCC; text-align: right;"> GANTI DENGAN TEKS/SCRIPT KODE ANDA </div>

DOTTED BORDER :
<div style="border: 3px #000099 dotted; padding: 5px; background-color: #00FFCC; text-align: center;"> GANTI DENGAN TEKS/SCRIPT KODE ANDA </div>

OUTSET BORDER :
<div style="border: 3px #000099 outset; padding: 5px; background-color: #00FFCC; text-align: center;"> GANTI DENGAN TEKS/SCRIPT KODE ANDA </div>

INSET BORDER :
<div style="border: 3px #000099 inset; padding: 5px; background-color: #00FFCC; text-align: left;"> GANTI DENGAN TEKS/SCRIPT KODE ANDA </div>

DOUBLE BORDER :
<div style="border: 3px #000099 double; padding: 5px; background-color: #00FFCC; text-align: center;"> GANTI DENGAN TEKS/SCRIPT KODE ANDA </div>

RIDGE BORDER :
<div style="border: 3px #000099 ridge; padding: 5px; background-color: #00FFCC; text-align: center;"> GANTI DENGAN TEKS/SCRIPT KODE ANDA </div>

GROOVE BORDER :
<div style="border: 4px #000099 groove; padding: 5px; background-color: #00FFCC; text-align: left;"> GANTI DENGAN TEKS/SCRIPT KODE ANDA </div>

SCROLL BORDER :
<div style="overflow:auto;width:140px;height:100px;padding:10px;background-color: #00FFCC;border:1px solid #000099"> GANTI DENGAN TEKS/SCRIPT KODE ANDA </div>


SCROLL BORDER: harus terlebih dahulu mem-parse script kode-nya (Convert/merubah kode html). Anda bisa mencari parse script di internet. Sekian info cara membuat Border pada kalimat atau Script Kode pada postingan Blog.


Tidak ada komentar: