Cara Membuat Kotak dengan Scroll

cara membuat kotak scroll
Setelah membahas Cara Membuat Kotak Komentar Facebook, sekarang mengenai Cara Membuat Kotak dengan Scoll atau Scroll Box Simple. Kotak Scroll adalah sebuah tempat untuk memasukkan text, gambar, dan lainnya yang memiliki ukuran besar tetapi bisa memperkecil tampilan kotak tanpa harus menghilangkan tinggi dari text / gambar tersebut.

Scroll ini adalah sebagai fungsi untuk menggulirkan sebuah kotak dengan mouse atau papan ulir di sampingnya. Kita dapat mengatur dan memodifikasi ukuran tinggi atau lebar scroll ini. Contoh penggunaan scroll box adalah sebagai berikut :

Penggunaan Kotak biasanya digunakan untuk memberi garis pembatas untuk script yang akan ditampilkan di sebuah artikel. Mengapa perlu membuat kotak di dalam artikel?

Search Engine membaca semua halaman artikel dalam bentuk text, jika kita menampilkan kode script tanpa disertai kotak maka secara otomatis semua kode tersebut akan diindex juga oleh mesin pencari. Maka dari itu, gunakan kotak di dalam postingan anda agar search engine hanya membaca bagian artikel yang penting.

Ini akan menjadi masalah besar terhadap isi dari konten artikel yang anda buat.

Cara Membuat Kotak dengan Scroll :
  • Copy kode berikut ini :
<div style="border:1px solid rgb(238,238,238);padding:10px;overflow:auto;width:555px;height:15;">Cara Membuat Menu Dropdown CSS</div>
  • Ganti kode berwarna merah dengan kata yang ingin anda masukkan di dalam kotak scroll tersebut.
  • Ganti kode berwarna ungu dengan ukuran tinggi dan lebar kotak tersebut.
  • Bisa juga dengan menggunakan kode berikut :
<div style="border: 1px solid #555; height: 10px; overflow: auto; padding: 10px; width: 250px;">Masukkan Text Area</div>

Untuk memperkecil ruang pada template kita memang sangat tepat apabila menggunakan tips ini. Ruang bebas akan banyak tersedia di blog kita dan akan lebih jauh efektif. Baca juga kategori artikel lainnya terkait Membuat Kotak Scroll ini.