Pada
Tutorial blog kali ini saya akan kasih tips cara membuat Scroll Box.
Scroll Box banyak digunakan di web atau blog. Scroll Box sangat berguna
sekali untuk menghemat tempat, terutama bila halaman web atau blog
sudah penuh dan sementara masih banyak artikel atau apa saja yang ingin
tetap ditampilkan pada satu halaman. Scroll Box selain bisa digunakan
untuk tempat artikel, banyak juga yang menggunakan Scroll Box sebagai
tempat daftar isi.
Cara membuat Scroll Box sangat mudah, silahkan anda perhatikan contoh dibawah ini berikut kodenya :
<div align="center">
<table width="250" border="1">
<tr> <th colspan="100%" scope="col">JUDUL ARTIKEL</th> </tr>
<tr><td><div style="font-family: arial; font-size: 12px; overflow: scroll; width: 250px; height: 100px;"><div style="text-align: center; width: 100%; padding: 0 px; overflow: hidden;">Silahkan anda bisa mengisi artikel atau daftar isi atau apa saja disini. Semakin banyak teks yang anda isikan dalam scroll box ini, dengan sendirinya akan membentuk kotak scroll box secara otomatis, sehingga dapat menghemat tempat. Lihat Contoh scroll box dibawah dengan isi teks yang lebih banyak.</div></div></td></tr>
</table>
</div>
<table width="250" border="1">
<tr> <th colspan="100%" scope="col">JUDUL ARTIKEL</th> </tr>
<tr><td><div style="font-family: arial; font-size: 12px; overflow: scroll; width: 250px; height: 100px;"><div style="text-align: center; width: 100%; padding: 0 px; overflow: hidden;">Silahkan anda bisa mengisi artikel atau daftar isi atau apa saja disini. Semakin banyak teks yang anda isikan dalam scroll box ini, dengan sendirinya akan membentuk kotak scroll box secara otomatis, sehingga dapat menghemat tempat. Lihat Contoh scroll box dibawah dengan isi teks yang lebih banyak.</div></div></td></tr>
</table>
</div>
Ada juga Scroll box yg sederhana, seperti contoh dibawah ini:
Berikut Kode untuk scroll box diatas :
Anda bisa mengatur sendiri lebar/tinggi box.... selamat mencoba
Berikut Kode untuk scroll box diatas :
<div style="background: #AEE4E3; height: 200px; overflow: auto; padding: 5px 5px 5px 5px; width: 100%px;">
<center><b>
TULISAN ANDA
</b></center></div>
Anda bisa mengatur sendiri lebar/tinggi box.... selamat mencoba
:.
0 komentar:
Posting Komentar