MoreLesson 195Preview gratis
Ribbon
Lesson ini bagian dari How To · Semua level
Ringkasan
Ribbon adalah pita kecil yang ditempelkan di sudut kartu atau gambar, biasanya untuk menandai produk baru, diskon, atau status khusus. Efeknya dibuat dengan posisi absolut di dalam kontainer yang berposisi relative, lalu diputar sedikit agar terlihat seperti pita asli. Overflow hidden pada induk memastikan bagian pita yang keluar area tidak mengganggu tata letak.
Poin kunci
- Kontainer induk harus position: relative sebagai titik acuan posisi pita
- Pita itu sendiri memakai position: absolute dengan nilai top dan right
- transform: rotate(45deg) memberi kesan pita miring di sudut
- overflow: hidden pada induk merapikan bagian pita yang keluar dari kartu
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.