CSS TutorialLesson 17Preview gratis
CSS Icons
Lesson ini bagian dari CSS · Semua level
Ringkasan
Ikon di halaman web umumnya ditampilkan dengan dua cara: memakai pustaka ikon berbasis font atau gambar SVG. Dengan pendekatan font, ikon diperlakukan seperti teks sehingga ukuran dan warnanya bisa diubah lewat CSS. Cukup tambahkan kelas ikon pada sebuah elemen, lalu atur gayanya dengan properti font biasa.
Poin kunci
- Pustaka ikon berbasis font dipakai dengan menautkan CSS pustaka lalu menambahkan kelas ikon.
- Ikon font diperlakukan seperti karakter teks sehingga mengikuti properti color dan font-size.
- Elemen <i> atau <span> lazim dipakai sebagai wadah ikon.
- SVG bisa disisipkan langsung sebagai <svg> atau lewat background-image.
- Ikon murni dekoratif sebaiknya diberi aria-hidden="true" agar pembaca layar tidak membacanya.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.