Kita tidak perlu menjelaskan panjang lebar dan membuktikan apa pun kepada siapa pun bahwa kita baik. Jangan merepotkan diri sendiri dengan penilaian orang lain. Pada akhirnya, kita sendiri yang tahu persis apakah kita memang baik atau tidak. Oke kesempatan kali ini saya akan berbagi ilmu lagi kepada kalian tentang bagaimana Cara Membuat Efek Grayscale Pada Gambar dengan CSS.
Masih seputar memberikan efek pada gambar dengan CSS, kali ini kita akan memberikan efek Grayscale pada gambar. Yang dimaksud dengan Grayscale adalah membuat gambar menjadi hitam dan putih. Oke langsung saja, berikut Cara Membuat Efek Grayscale Pada Gambar dengan CSS.
Seperti biasa, pertama-tama siapkan file index.html nya terlebih dahulu.
Kemudian, isi di bagian <body> tag HTML berikut.
<img src="pineapple.jpg" alt="Pineapple" width="300" height="300"> <p><strong>Note:</strong> Filter ini tidak berfungsi pada Internet Explorer, Edge 12, atau Safari 5.1 dan versi lain nya.</p>
Dan setelah itu, isi untuk CSS nya seperti berikut.
img {
-webkit-filter: grayscale(100%); /* Chrome, Opera */
filter: grayscale(100%);
}Bagaimana teman-teman? Cukup mudah bukan?
Sekian untuk tutorial kali ini tentang Cara Membuat Efek Grayscale Pada Gambar dengan CSS.
Semoga bermanfaat, terima kasih
The post Cara Membuat Efek Grayscale Pada Gambar dengan CSS appeared first on Kursus Website Terbaik.