Cara Membuat Scroll Box di Postingan Blog


Cara Membuat Scroll Box di Postingan Blog

Untuk membuat scroll box dalam postingan blog (contohnya di Blogger), kamu boleh gunakan HTML ringkas yang akan menjadikan sebahagian teks dalam entri boleh di-scroll. Ini sangat berguna untuk meletakkan petikan panjang, kod, atau puisi, agar kelihatan kemas dan tidak terlalu memanjangkan post.


Contoh Kod Scroll Box:

<div style="border:1px solid #ccc; padding:10px; width:100%; height:150px; overflow:auto; background:#f9f9f9;">

Tulis teks kamu di sini. Kamu boleh masukkan puisi, kata-kata panjang, atau apa-apa sahaja.

Jika terlalu panjang, bahagian ini akan muncul scrollbar secara automatik.

Contohnya:

Baris pertama,

Baris kedua,

Baris ketiga,

dan seterusnya...

</div>


Penjelasan Ringkas:

  • border: Garis luar kotak (boleh diubah warna dan ketebalan).

  • padding: Ruang dalam antara teks dan sempadan kotak.

  • width: Lebar kotak (boleh guna 100% supaya ikut saiz post).

  • height: Tinggi kotak. Tukar ikut keperluan.

  • overflow:auto: Menjadikan scroll muncul jika kandungan melebihi tinggi yang ditetapkan.

  • background: Warna latar belakang kotak (boleh tukar ke #ffffff, #e0f7fa, dll).



Contoh Scroll Box Gaya Lebih Elegan:


"Kadang-kadang, aku hanya ingin diam. Membiarkan dunia berlalu tanpa perlu aku jelaskan apa-apa. Ada luka yang tak perlu disebut. Ada tangis yang tak perlu dipujuk. Dan ada perasaan… yang cuma ingin difahami dari kejauhan."


Cara Letak di Blogger:

  1. Buka Post → pilih HTML mode (bukan Compose).

  2. Salin kod scroll box di atas dan tampal ke mana-mana bahagian post.

  3. Simpan dan lihat hasilnya.


Selamat mencuba...

Catat Ulasan

1 Ulasan