Cara Menciptakan Kotak Scrollbar Di Postingan Blog

Apa itu Scrollbar? scroolbar disini maksudnya sebuah media yang digunakan untuk meringkas gesekan pena panjang dalam sebuah kotak yang mampu di scrool sehingga menampilkan isi keseluruhan tulisan. Model mirip ini sering kita lihat pada postingan blog yang membahas tentang kode-kode pemrograman. 

Scrollbar memiliki banyak jenis untuk meringkas gesekan pena panjang, namun pada postingan ini admin akan membahas 3 jenis scrollbar yaitu:

Sebelum membahas apa-apa saja jenisnya, admin akan menunjukkan penjelasan untuk meletakkan kode-kode setiap jenis scrollbar. 

Caranya:

-Silahkan masuk di halaman posting blog. 
-Selanjutnya pada halaman tersebut ada terdapat dua hidangan yaitu : Compose dan HTML.
-Lalu copylah kode-kode scroll dibawah ini dan paste kan pada halaman menu HMTL. 
-Setelah itu, masuk ke halaman menu Compose dan pastekan lah kode-kode atau gesekan pena yang ingin ditampilkan tepat di halaman kotak scrollbar yang telah dibuat (pada Tulisan Masukkan Tulisan Anda Disini). 


Berikut ini adalah Jenis-jenis Scrollbar yang akan dibahas pada postingan ini:

1.Scroll Horizontal

Scrooll horizontal artinya gesekan pena di ringkas dalam bentuk memanjang. 

Berikut ini kodenya:

<div style="border:1px solid black;width:auto ;height:50px;overflow-y:hidden;overflow-x:scroll;">
<p style="width:2500%;">
MASUKKAN TULISAN ANDA DISINI
</p>
</div>

Hasilnya:

Scroll horizontal artinya gesekan pena di ringkas dalam bentuk memanjang, untuk membuat scroll horisontal gunakan isyarat yang tertera dibawah ini.

2.Scroll Vertikal

Scroll vertikal artinya gesekan pena di ringkas dalam bentuk memanjang dari atas kebawah.

Berikut ini kodenya:

<div style="background-color: #f0f0f0; border: 1px solid #1E90FF; height: 100px; overflow: auto; padding: 5px; width: auto;">
MASUKKAN TULISAN ANDA DISINI
</div>

Hasilnya:

Scroll vertikal artinya gesekan pena di ringkas dalam bentuk memanjang dari atas kebawah, untuk membuat scroll vertikal gunakan isyarat yang tertera dibawah ini.

3.Scroll Vertikal dan Horizontal 

Scroll vertikal dan Horistonal artinya gesekan pena di ringkas dalam bentuk memanjang dari atas kebawah serta kekiri dan kanan.

Berikut ini kodenya: 

<div style="border:1px solid red;width:auto;height:50px;overflow-y:scroll;overflow-x:scroll;">
<p style="width:2500%;">
MASUKKAN TULISAN ANDA DISINI
</p>
</div>

Hasilnya:

Scrooll vertikal dan Horistonal artinya gesekan pena di ringkas dalam bentuk memanjang dari atas kebawah serta kekiri dan kanan, untuk membuat scroll vertikal, horisontal gunakan isyarat yang tertera dibawah ini.

Scroll Vertikal 

Scrol vertikal artinya gesekan pena di ringkas dalam bentuk memanjang dari atas kebawah, tapi untuk isyarat HTMlL yang digunakan dalam isyarat ini sedikit berbeda. 

Berikut ini kodenya:

<div style="border:1px solid red;width:auto;height:50px;overflow-y:scroll;overflow-x:scroll;">
<p style="width:2500%;">
MASUKKAN TULISAN ANDA DISINI
</p>
</div>

Hasilnya:

Scroll vertikal artinya gesekan pena di ringkas dalam bentuk memanjang dari atas kebawah, namun untuk isyarat HTMlL yang digunakan dalam isyarat ini sedikit berbeda. untuk membuat scroll vertikal gunakan isyarat yang tertera dibawah ini.

Demikianlah cara membuat kotak scrollbar di postingan blog, semoga bermanfaat dan terimakasih. 

Bagikan Artikel ini