Scroll box untuk postingan blog

Author: UUF Hasibuan // Category:
Seperti halnya penggunaan textarea, scroll box juga berfungsi untuk lebih memudahkan blogger dan terutama pembaca blog saat menikmati blog yang berkaitan dengan KODE HTML. Penggunaan scroll box sedikit mempunyai nilai lebih karena dokumen yang dipostingkan di dalamnya dengan mudah dapat dilakukan beberapa perubahan seperti halnya jenis, warna dan ukuran font yang pada akhirnya akan lebih memudahkan bagi pembaca blog untuk memahami dokumen yang terposting. Selain dari hal tersebut, dalam scroll box dapat juga disertakan posting yang berupa image atau gambar. Scroll box dapat dibuat dalam bentuk yang paling sederhana hingga bentuk yang cukup kompleks dengan memadukan KODE HTML dan image hingga tercipta sebuah scroll box yang indah, dinamis dan atraktif. Dibawah ini salah satu contoh bentuk scroll box sederhana yang dapat dikembangkan menjadi bentuk yang lebih kompleks dengan menambahkan beberapa fungsi lain baik dengan menggunakan KODE CSS ataupun gambar.
Gunakan KODE berikut saat melakukan posting
<div style="height:200px; width:500px; background: #66CCFF; border:2px solid #0000FF; padding: 20px 6px; overflow: scroll;">Letakkan Teks/Image/KODE HTML atau materi posting yang lain di sini</div>
Kamu juga bisa membentuk sebuah scroll box dengan menggunakan KODE CSS dengan menyimpannya di bagian head di antara tag <head> dan tag </head>. Dengan menggunakan CSS yang bersifat permanen, maka KODE lain yang dipergunakan saat melakukan posting menjadi lebih simple dan ruang posting menjadi tidak penuh sesak oleh banyaknya KODE HTML pembentuk scroll box.
Langkah yang harus dilakukan adalah sebagai berikut
Simpan KODE CSS berikut di bagian head
.postingbox {
height: 200px; /* ukuran tinggi bisa disesuaikan */
width: 500px; /* sesuaikan lebar dg kebutuhan atau pakailah auto */
background: #66CCFF url();/* gunakan warna yg sesuai blog atau apabila ingin menggunakan background image */
border: 2px solid #333; /*tebal, jenis dan warna */
overflow: scroll;
font-size: 12px; /* ukuran font */
font-family: Verdana; /*atau jenis font lain */
font-weight: 700; /* atau bisa juga bold atau bolder */
padding: 20px 6px; /* atas/bawah=20px, kanan/kiri=6px */
}
Gunakan KODE berikut saat melakukan posting
<div class="postingbox">Letakkan di sini Teks/Image/KODE HTML yang akan dipostingkan</div>

0 Responses to "Scroll box untuk postingan blog"

Posting Komentar

 
 
Send Email

Your Name
Your Email Address
Subject
Message
Image Verification
captcha
Please enter the text from the image:
[ Refresh Image ] [ What's This? ]

Powered byEMF Web Form