Salah
satu cara agar tampilan website/blog lebih menarik adalah dengan memberi back
ground warna pada tulisan khususnya text box, dan ini biasa kita gunakan jika
kita memberi informasi khususnya dalam penulisan SCRIPT untuk di copy paste
oleh pengunjung Web atau Blog. Hal ini bisa kita lakukan dengan kode (tag) HTML
DIV. DIV merupakan kode HTML yang akan menghasilkan blok paragraf, atau dengan
kata lain disebut dengan Text Box.
Karena
dengan menuliskan paragraf atau kalimat diantara tag <div>isi tulisan
kita</div>, maka kalimat/paragraf tersebut akan tampil dalam box yang
bisa kita atur tampilannya. Untuk memudahkannya, Saya akan membagikan beberapa contoh dan penggunaan tag DIV.
Kode Untuk Membuat Tulisan Ini
<div style="color:red;background:yellow;">disini tulisan yg akan tampil</div>
Anda bisa melihat contoh di atas, color adalah untuk warna tulisan dan background
untuk warna box, untuk 2 atribut itu bisa kita ganti dengan blue, brown, green
dll.
Kode Untuk Membuat Tulisan Ini
<div style="color:blue;background:#EBF3FB;border:1px solid #AACCEE;">tulisan yg akan tampil</div>
Penggunaan
ini sama seperti yg pertama, hanya bedanya disini kita pake border..border
adalah garis tepi..kita bisa sesuaikan dgn selera kita (semakin tinggi nilai px
border..maka semakin tebal garis tepinya)
Kode Untuk Membuat Tulisan Ini
<div style="color:#990099;background:#ADE4AD;border:2px dashed #006600;padding:5px;margin:10px;">tulisan yg tampil</div>
Margin
adalah kode untuk jarak tulisan ke kotak (atas, bawah, kiri, kanan)..silahkan
di rubah-rubah sesuai dgn selera kita.
Text
Box yg di atas itu semua...lebar kotaknya akan mengikuti sesuai dengan panjang
tulisan kita, tapi yg di bawah ini lebar kotak bisa kita sesuaikan sendiri.
Kode Untuk Membuat Tulisan Ini
<div style="color:#FFFFFF;background:#FFD4AA;border:2px dotted #FF2A00;padding:5px;margin:5px;width:600px;">tulisan yg tampil</div>
Lebar
kotaknya bisa kita atur dengan menambahkan nilai pada width :600px
Semoga artikel ini bermanfa'at.
EmoticonEmoticon