84669 orang belajar
152542 orang belajar
20005 orang belajar
5487 orang belajar
7821 orang belajar
359900 orang belajar
3350 orang belajar
180660 orang belajar
48569 orang belajar
18603 orang belajar
40936 orang belajar
1549 orang belajar
1183 orang belajar
32909 orang belajar
Bagaimana untuk menyatakan ini
${window.scrollY > 0 ? Adakah penyata bersyarat menyemak hanya untuk Tailwind pada saiz skrin sederhana atau besar?
Adakah penyata bersyarat menyemak hanya untuk Tailwind pada saiz skrin sederhana atau besar?
Anda boleh melakukannya dengan mudah dengan menambahkan kod berikut pada kod anda:
className={md:${window.scrollY > 0 ? "bg-slate-50" : "bg-transparent"}}
Inilah yang dilakukan oleh Tailwind. Jika tidak, anda boleh menulis CSS tersuai sendiri.
Sila ambil perhatian, sila pastikan anda memasukkan varian yang diperlukan dalamtailwind.config.jsanda jika ia belum didayakan:
tailwind.config.js
module.exports = { variants: { backgroundColor: ['responsive', 'hover', 'focus'], // ... other configurations }, }
${window.scrollY > 0 ? "max-md:bg-slate-50" : ""}
Anda juga boleh mengetahui lebih lanjut daripada dokumentasi Tailwind:https://tailwindcss.com/docs/responsive-design#targeting-a-single-breakpoint
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Anda boleh melakukannya dengan mudah dengan menambahkan kod berikut pada kod anda:
className={md:${window.scrollY > 0 ? "bg-slate-50" : "bg-transparent"}}Inilah yang dilakukan oleh Tailwind. Jika tidak, anda boleh menulis CSS tersuai sendiri.
Sila ambil perhatian, sila pastikan anda memasukkan varian yang diperlukan dalam
tailwind.config.jsanda jika ia belum didayakan:module.exports = { variants: { backgroundColor: ['responsive', 'hover', 'focus'], // ... other configurations }, }${window.scrollY > 0 ? "max-md:bg-slate-50" : ""}Anda juga boleh mengetahui lebih lanjut daripada dokumentasi Tailwind:https://tailwindcss.com/docs/responsive-design#targeting-a-single-breakpoint