Inilah CSS dan Fungsi OVERFLOW
January 08, 2024Halo Sahabat Kang Rizky, berjumpa lagi ya di Blog yang sama ya, dalam kesempatan kali ini mimin akan berbagi Inilah CSS dan Fungsi OVERFLOW.
Sahabat OVERFLOW sering digunakan dalam sebuah code CSS. Fungsi dari overflow yakni untuk menyembunyikan, memperlihatkan, atau membuat sebuah scrolling pada Blog sahabat. Fungsi ini bisa sahabat terapkan dalam objek teks maupun sebuah gambar.
Pada objek ini tertentu, baik pada posting maupun widgetnya, terkadang ada yang memakan tempat ke pinggir atau ke bawah pada blog sahabat. Supayanya objek tersebut agar bisa muncul sesuai dengan yang sahabat inginkan, maka dari itu digunakannya syntax overerflow.
Penggunaan code sangatlah mudah ini ada beberapa alternatif, yaitu sebagai berikut ini:overflow:scroll
overflow:auto
overflow:hidden
overflow:display
<div style="background-color:#FBFBFB; border:1px solid #D2D2D2; padding:10px; width:400px; height:100px; overflow:auto;">
teks maupun gambar disini ya</div>
Keterangan:background-color : warna latar belakang
border : warna garis pinggir
padding : jarak dari pinggir garis ke objeknya
width : lebar
height : tinggi
overflow : silahkan pilih seperti ini auto, scroll, hidden ataupun display sesuai kebutuhan sahabat.
Hasilnya overflow:auto
Pada Contoh teks disinilah, ataupun sahabat bisa diisi dengan gambar. silahkan sahabat pilih opsi overflownya sesuai keinginan sahabat. Begitu juga sebaliknya warna latar belakang, garis pinggir dan jaraknya, sesuaikan yang sahabat inginkan ya.
Pada Contoh teks disinilah, ataupun sahabat bisa diisi dengan gambar. silahkan sahabat pilih opsi overflownya sesuai keinginan sahabat. Begitu juga sebaliknya warna latar belakang, garis pinggir dan jaraknya, sesuaikan yang sahabat inginkan ya.
Hasilnya overflow:scroll
Pada Contoh teks disinilah, ataupun sahabat bisa diisi dengan gambar. silahkan sahabat pilih opsi overflownya sesuai keinginan sahabat. Begitu juga sebaliknya warna latar belakang, garis pinggir dan jaraknya, sesuaikan yang sahabat inginkan ya.
Pada Contoh teks disinilah, ataupun sahabat bisa diisi dengan gambar. silahkan sahabat pilih opsi overflownya sesuai keinginan sahabat. Begitu juga sebaliknya warna latar belakang, garis pinggir dan jaraknya, sesuaikan yang sahabat inginkan ya.
Hasilnya overflow:hidden
Hasilnya overflow:display
Pada Contoh teks disinilah, ataupun sahabat bisa diisi dengan gambar. silahkan sahabat pilih opsi overflownya sesuai keinginan sahabat. Begitu juga sebaliknya warna latar belakang, garis pinggir dan jaraknya, sesuaikan yang sahabat inginkan ya.
Apabila sahabat mempunyai pertanyaan ataupun saran positif mengenai CSS Fungsi Overflow, silahkan sahabat dapat mengisi kolom komentar yang sudah mimin sediakan ya...