Ini merupakan pola text yang menggunakan pengaruh manual scrolling text. Secara normal, text ini akan terlihat selaku paragraf di dalam post body menyerupai text di atas, dimana batas kiri, kanan, atas, dan bawah dibatasi oleh margin atau alignment yang sudah diberi pengaturan default di dalam template HTML.
Style diatas dibikin dengan menggunakan div styling, dengan menyertakan atribut pembatasan lebar (width) dan tinggi (height) pada area text, dimana area text tersebut sebenarnya lebih tinggi dan atau lebih lebar dari batas-batas yang diberikan. Lalu, untuk menampilkan notifikasi pada browser bahwa komponen text mesti sanggup dilihat tetapi dalam luas area yang sudah diputuskan tersebut, digunakanlah atribut overflow: scroll untuk menampilkan pengaruh scroll, ataupun overflow: auto yang secara otomatis akan menampilkan pengaruh scroll apabila area text disempitkan. Logikanya, hal ini sama dengan area sebuah halaman blog /website atau dokumen-dokumen lain di PC. Jika halaman tersebut lebih panjang dari area browser (juga menurut resolusi layar monitor), maka akan timbul scroller di sebelah kanan browser, dan apabila lebih lebar, maka akan timbul scroller di bab bawah browser.
So, kita sanggup menggunakan dasar tag <div style="....">text yang akan diberi style</div> sama menyerupai text styling yang lainnya, dengan menyertakan tiga atribut penting: height, overflow:scroll/auto, dan weight:
<div style="height xx; overflow: auto; weight: xx">text yang akan diberi pengaruh scroll text</div>
Sebagai pola hasil dasarnya menyerupai ini:
text yang akan diberi pengaruh scroll text text yang akan diberi pengaruh scroll text text yang akan diberi pengaruh scroll text text yang akan diberi pengaruh scroll text text yang akan diberi pengaruh scroll text text yang akan diberi pengaruh scroll text
Dan ini tag serta atribut yang dipakai untuk pola di atas:
<div style="height: 70px; overflow: auto; width: 200px;">text yang akan diberi pengaruh scroll text text yang akan diberi pengaruh scroll text text yang akan diberi pengaruh scroll text text yang akan diberi pengaruh scroll text text yang akan diberi pengaruh scroll text text yang akan diberi pengaruh scroll text</div>
Nah, kemudian mudah-mudahan scroll text tersebut menjadi manis atau indah dan timbul pada posisi sesuai dengan keinginan, tambahkan atribut-atribut styling yang lain, misalnya: border, margin, padding, text-align, atau background. Sebagai contoh:
Ini merupakan pola Scroll Text dengan tinggi 80px, border berskala 2px berjenis solid dan berwarna lightblue, dengan menggunakan overflow berjenis auto, text-align berjenis justify(rata kanan kiri), dengan batas margin kiri sebesar 30px, padding sebesar 3px, dan memiliki luas sebesar 300px.
Ini tag dan atribut yang digunakan:
<div style="border: 2px solid lightblue; height: 80px; margin-left: 30px; overflow: auto; padding: 3px; text-align: justify; width: 300px;">
Ini merupakan pola Scroll Text dengan tinggi 80px, border berskala 2px berjenis solid dan berwarna lightblue, dengan menggunakan overflow berjenis auto, text-align berjenisjustify (rata kanan kiri), dengan batas margin kiri sebesar 30px, padding sebesar 3px, dan memiliki luas sebesar 300px.</div>
Untuk praktisnya, anda sanggup meng-copy yang di bawah ini:
<div style="border: 2px solid #000000; height: 100px; margin-left: 20px; overflow: auto; padding: 3px; text-align: left; width: 320px;">Text anda disini</div>
Yang berwarna biru merupakan value atau ukuran border, tinggi, margin, padding, dan luas area. Anda sanggup menggantinya sesuai keinginan.
Yang berwarna merah merupakan nilai warna border, anda sanggup pula mengubahnya. Untuk tutorial code warna hex, sanggup dilihat disini.
Text-align memiliki 4 value: left, center, justify, dan right.
Text-align memiliki 4 value: left, center, justify, dan right.
Anda sanggup mengutak-atik atribut-atribut di atas; bahkan memperbesar atau meniadakan atribut yang tidak diperlukan, kecuali 3 atribut inti: height, overflow, dan width untuk mendapat bentuk scroll text blog yg diinginkan.
Untuk bab posting gunakan edit HTML, untuk sidebar pilih gadget HML/JavaScript.
Have a nice experiment and be creative.Untuk bab posting gunakan edit HTML, untuk sidebar pilih gadget HML/JavaScript.
Tersaji dengan Esensi
mencuri merupakan pekerjaan pengecut! © buka-rahasia.blogspot.com
