Jumat, 27 September 2013

Buat Border Pada Tulisan di Blog

Untuk membuat tulisan pada posting yang mempunyai border atau bisa dikatakan membuat border text pada posting, anda dapat menggunakan perintah/ kode di bawah ini :
 
Solid Border
<div style="border: 2px #006400 solidpadding: 10pxbackground-color: #c3fdb8text-align: left;"> TULIS SCRIPT/KODENYA DISINI </div>

Keterangan: 


border: 2px
 
Untuk ketebalan garis tepinya, Anda bisa ganti ketebalan-nya dengan angka lain sesuaikan dengan kebutuhan Anda 


#006400 

Untuk warna border yang Anda kehendaki. 


solid 

Untuk jenis border yang akan kita pakai. 


padding: 10px 

Untuk memberi batas garis tepi dengan tulisan, memungkinkan agar ada jaraknya dari garis tepi.
 

background-color: #c3fdb8
 
Untuk memberi warna pada latar belakang folder tersebut 


text-align: left
 
Untuk pengaturan paragraf teks di dalam border tersebut. 




Sedangkan untuk kode border yang lain, anda dapat memilih kode/ script di bawah ini :

Ridge Border
<div style="border: 2px #006400 ridge; padding: 10px; background-color:  #c3fdb8; text-align: left;"> TULIS SCRIPT/KODENYA DISINI </div>
Groove Border
<div style="border: 2px #006400 groove; padding: 10px; background-color:  #c3fdb8; text-align: left;"> TULIS SCRIPT/KODENYA DISINI </div>
Inset Border
<div style="border: 2px #006400 inset; padding: 10px; background-color:  #c3fdb8; text-align: left;"> TULIS SCRIPT/KODENYA DISINI </div>
Outset Border
<div style="border: 2px #006400 outset; padding: 10px; background-color:  #c3fdb8; text-align: left;"> TULIS SCRIPT/KODENYA DISINI </div>
Dotted Border
<div style="border: 2px #006400 dotted; padding: 10px; background-color:  #c3fdb8; text-align: left;"> TULIS SCRIPT/KODENYA DISINI </div>
Dashed Border
<div style="border: 2px #006400 dashed; padding: 10px; background-color:  #c3fdb8; text-align: left;"> TULIS SCRIPT/KODENYA DISINI </div>
Border dengan scroll, lebar dan tinggi
<div style="border: 2px #006400  solid; padding: 10px; background-color: #c3fdb8; overflow: auto; height: 50px; width: 300px; text-align: left;"> TULIS SCRIPT/KODENYA DISINI </div>
Sekian yang dapat saya sampaikan semoga sukses.

2 komentar:

Posting Komentar

© Copyright 2013 Kumpulan Trik dan Tips Blog
Diberdayakan oleh Blogger.