Cara Penggunaan Property Clip pada CSS

Hallo teman-teman, Bertemu kembali dengan saya dan masih diwebsite ini. Semoga di hari ini teman-teman masih diberikan medis agar dapat kembali dan tetap semangat pada mencari ilmu.

Oke di kesempatan kali ini saya akan membahas mengenai Cara Pemakaian Property Clip di CSS.

Jadi di dasarnya CSS itu mempunyai property clip dan tujuan atau guna dari property ini yaitu bagi memotong sebuah objek berupa gambar.

Dan yang mesti teman-teman ketahui pada pemakaian property clip ini hanya dapat diaplikasikan di element dengan property position dengan nilai absolute. Ya mungkin disitulah kelemahan dari property clip ini. Tetapi jangan risau dengan property clip ini kita dapat bereksperimen.

Bagi lebih jelasnya mari kita mulai Cara Pemakaian Property Clip di CSS, pertama-tama bikin folder terlebih dahulu, lalu masukan gambar bebas kedalam folder yang tadi telah kita bikin dan disini saya menggunakan gambar ini :

kemudian buka text-editornya dan masukan script HTML dibawah ini :

<img src=kucing.jpg>

Script HTML diatas yaitu element HTML bagi menampilkan gambar, teman-teman dapat sesuaikan dengan nama gambar yang teman-teman gunakan serta formatnya. Kemudian langkah berikutnya ketik script CSS dibawah ini kedalam text-editornya dan disini kita menggunakan CSS internal :

img{
 position:absolute;
 clip:rect(0px,540px,280px,255px);
}

Kalau telah seperti diatas, penjelasan singkat mengenai nilai di property clip ini sama dengan margin dan padding atau biasanya seperti arah jarum jam dengan 4 value jadi atas,kanan,bawah,kiri.

Oke jikalau telah seketika teman-teman simpan dengan nama index.html atau terserah teman-teman yang urgen formatnya .html dan kemudian silahkan teman-teman run/jalankan dibrowser yang teman-teman gunakan karenanya hasilnya hanya akan terlihat seperti di gambar dibawah ini :

Jadi seperti begitulah Cara Pemakaian Property Clip di CSS. Lumayan gampang kan teman-teman, silahkan bereksperiment lagi ya.

Oke bagi pembahasan kali ini mengenai Cara Pemakaian Property Clip di CSS lumayan hingga disini dulu, jikalau ada kekurangan harap dimakluminya dan semoga dapat bermanfaat untuk teman-teman, hingga bertemu di pembahasan berikutnya.

Terimakasih

Sumber https://kursuswebsite.org