Tailwind CSS Academy logo
HTMLWebTahap A1 → B222 bahasa

Tailwind CSS Academy

Kuasai rangka kerja CSS berasaskan utiliti yang dipercayai oleh OpenAI, Vercel dan Shopify. Pelajari setiap utiliti, reka bentuk responsif, mod gelap, animasi dan pengoptimuman untuk produksi. Laluan pembelajaran CoddyKit yang merangkumi 30 kursus pendek dan 120 pelajaran interaktif, dengan tutor kecerdasan buatan 24/7 di sisi anda.

Kursus
30
Pelajaran
120
Langkah interaktif
1,559
Percuma untuk bermula
Kursus 1
Kurikulum

30 kursus dalam laluan ini

Setiap kursus dalam laluan Tailwind CSS Academy, mengikut urutan pembelajaran. Kursus pertama adalah percuma.

1

A14 pelajaranPercuma

Kenali falsafah berteraskan utiliti di sebalik Tailwind CSS dan fahami perbezaannya daripada rangka kerja CSS tradisional seperti Bootstrap. Pelajari cara menyediakan Tailwind dalam projek dan menuli…

2

A14 pelajaranPRO

Kuasai set utiliti tipografi Tailwind yang kaya untuk mengawal saiz fon, ketebalan, ketinggian baris, jarak huruf dan penjajaran teks. Pelajari cara menghasilkan teks yang mudah dibaca dan menarik se…

3

A14 pelajaranPRO

Terokai palet warna Tailwind yang luas dan pelajari cara menggunakan warna latar belakang, kecerunan serta imej latar belakang. Fahami cara menggunakan pengubah suai kelegapan dan mencipta permukaan…

4

A14 pelajaranPRO

Pelajari skala jarak Tailwind yang konsisten untuk menambah margin dan padding pada mana-mana unsur. Fahami pintasan berarah serta margin negatif untuk mengawal reka letak dengan tepat.

5

A14 pelajaranPRO

Gunakan reka letak CSS Flexbox melalui utiliti flex Tailwind tanpa menulis satu baris CSS tersuai pun. Bina reka letak mendatar dan menegak, kawal penjajaran serta urus pembalutan dengan mudah.

6

A24 pelajaranPRO

Manfaatkan CSS Grid melalui utiliti grid Tailwind untuk membina reka letak dua dimensi yang kompleks. Takrifkan lajur, baris dan kawasan menggunakan nama kelas yang mudah serta kawal penempatan item…

7

A24 pelajaranPRO

Kawal dimensi unsur menggunakan utiliti lebar, tinggi, kekangan minimum/maksimum dan nisbah aspek Tailwind. Bina komponen responsif serta bersaiz tetap dengan yakin.

8

A24 pelajaranPRO

Gayakan tepi dan kedalaman unsur dengan utiliti sempadan serta bayang-bayang Tailwind. Pelajari cara menambah bucu bulat, mengawal ketebalan dan warna sempadan serta menggunakan bayang kotak untuk me…

9

A24 pelajaranPRO

Tambahkan interaktiviti pada UI dengan menggunakan gaya secara bersyarat ketika layang, fokus, aktif, dilumpuhkan dan keadaan pseudo yang lain. Pelajari sistem awalan variasi Tailwind untuk mengawal…

10

A24 pelajaranPRO

Bina reka letak yang menyesuaikan diri dengan mana-mana saiz skrin menggunakan titik henti responsif yang mengutamakan peranti mudah alih dalam Tailwind. Gunakan kelas utiliti yang berbeza pada lebar…

11

B14 pelajaranPRO

Laksanakan mod gelap dalam aplikasi web anda menggunakan variasi gelap terbina dalam Tailwind. Pelajari perbezaan strategi kelas dengan strategi media dan bina komponen UI yang kelihatan menarik dala…

12

B14 pelajaranPRO

Manfaatkan sepenuhnya kuasa Tailwind dengan menguasai fail tailwind.config.js. Pelajari cara melanjutkan tema lalai, menambah nilai tersuai, mengkonfigurasi laluan kandungan dan mengurus pemalam.

13

B14 pelajaranPRO

Sesuaikan Tailwind dengan jenama anda dengan menambah warna tersuai, mengintegrasikan Google Fonts dan mentakrifkan skala jarak tersuai. Bina bahasa reka bentuk khusus projek yang masih memanfaatkan…

14

B14 pelajaranPRO

Pelajari bila dan cara menggunakan arahan @apply Tailwind untuk mengekstrak corak utiliti berulang menjadi kelas CSS yang boleh diguna semula. Seimbangkan pendekatan berteraskan utiliti dengan keperl…

15

B14 pelajaranPRO

Tambahkan gerakan lancar pada UI menggunakan utiliti peralihan dan animasi terbina dalam Tailwind. Pelajari cara mengawal tempoh, pelonggaran dan kelewatan, serta menggunakan animasi bingkai utama un…

16

B14 pelajaranPRO

Bina primitif UI yang kemas dan boleh diguna semula menggunakan kelas utiliti Tailwind. Pelajari corak standard untuk butang dengan variasi, kad dengan pengepala serta pengaki dan lencana maklumat ke…

17

B14 pelajaranPRO

Bina bar navigasi responsif dan bar sisi boleh runtuh menggunakan utiliti Tailwind. Pelajari cara mengendalikan menu hamburger mudah alih dan mencipta navigasi melekat yang kekal ketika pengguna mena…

18

B14 pelajaranPRO

Gayakan unsur borang yang boleh dicapai dan menarik menggunakan utiliti Tailwind. Pelajari cara mencipta input teks, pilihan, kotak tanda, butang radio dan reka letak borang lengkap dengan keadaan pe…

19

B14 pelajaranPRO

Bina corak UI tindanan seperti modal, dialog dan menu jatuh bawah menggunakan Tailwind serta JavaScript minimum. Pelajari kedudukan, susunan z-index dan peralihan buka/tutup yang lancar.

20

B14 pelajaranPRO

Fahami enjin Just-In-Time Tailwind dan cara enjin itu menjana hanya CSS yang anda gunakan. Pelajari cara mengoptimumkan himpunan produksi, menganalisis saiz output dan menulis kelas yang boleh dikesa…

21

B24 pelajaranPRO

Wujudkan sistem token reka bentuk yang kukuh dalam konfigurasi Tailwind untuk membolehkan tema berbilang jenama yang konsisten. Petakan token primitif kepada token semantik dan bina bahasa reka bentu…

22

B24 pelajaranPRO

Integrasikan Tailwind CSS ke dalam aplikasi React dan Next.js menggunakan persediaan rasmi. Pelajari amalan terbaik untuk menggunakan utiliti dalam JSX, mengurus kelas bersyarat dan menyusun gaya dal…

23

B24 pelajaranPRO

Gabungkan Tailwind CSS dengan Headless UI untuk membina komponen tanpa gaya yang boleh dicapai sepenuhnya. Gunakan kelas Tailwind anda sendiri pada menu, dialog, kotak gabungan dan peralihan sambil m…

24

B24 pelajaranPRO

Luaskan fungsi Tailwind dengan menulis pemalam tersuai yang menambah utiliti, komponen dan variasi baharu. Pelajari API pemalam untuk merangkum logik gaya yang boleh diguna semula dan dikongsi merent…

25

B24 pelajaranPRO

Bina komponen UI yang memenuhi piawaian kebolehcapaian WCAG menggunakan utiliti Tailwind untuk kontras warna, pengurusan fokus dan sokongan pembaca skrin. Tulis struktur HTML serta gaya Tailwind yang…

26

B24 pelajaranPRO

Amalkan amalan terbaik profesional untuk menggunakan Tailwind CSS dalam aplikasi produksi. Pelajari pengauditan himpunan, strategi penyusunan kelas, pelintasan kod dan teknik pengoptimuman prestasi y…

27

B24 pelajaranPRO

Gunakan semua yang dipelajari setakat ini untuk membina halaman pendaratan pemasaran yang lengkap dan responsif dari awal, hanya menggunakan Tailwind CSS. Sertakan bahagian wira, ciri, testimoni, har…

28

B24 pelajaranPRO

Bina antara muka papan pemuka pentadbir yang lengkap menggunakan Tailwind CSS. Bina bar sisi, bar atas, kad statistik, jadual data dan widget ruang letak carta dalam reka letak yang padu serta respon…

29

B24 pelajaranPRO

Terokai cara Tailwind sesuai dengan strategi seni bina CSS yang lebih luas dan digunakan dalam projek berskala besar. Pelajari cara menyusun fail, menstruktur lapisan komponen serta menggabungkannya…

30

B24 pelajaranPRO

Gabungkan semua kemahiran daripada laluan ini untuk membina sistem reka bentuk berasaskan Tailwind yang lengkap. Takrifkan token, bina pustaka komponen, tulis pemalam dan dokumentasikan sistem untuk…

CoddyKit PRO

Dapatkan akses kepada kesemua 30 kursus dalam laluan ini dan semua laluan lain

Tutor AI, peperiksaan pensijilan dan sijil. Berfungsi di laman web, iOS dan Android.

Lihat semua pelan
Tahunan$29.90 / tahunKira-kira $2.49 sebulanBayar sekaliSeumur hidup$69.99 sekaliTiada pembaharuan. PRO selama-lamanya.
Gambaran Keseluruhan Kursus

Penguasaan Tailwind CSS

Kuasai rangka kerja CSS berasaskan utiliti yang dipercayai oleh OpenAI, Vercel dan Shopify. Pelajari setiap utiliti, reka bentuk responsif, mod gelap, animasi dan pengoptimuman untuk produksi. Laluan ini merangkumi 30 kursus mini progresif daripada pemula sepenuhnya (A1) hingga tahap lanjutan (B2), dengan pelajaran ringkas dan kuiz pantas untuk mengukuhkan setiap konsep.

Apa yang Akan Anda Pelajari

Anda akan bermula dengan asas dan meningkat kepada topik pertengahan serta lanjutan, dengan setiap kursus dibina berdasarkan kursus sebelumnya. Setiap pelajaran bersifat praktikal, disertai contoh sebenar dan tutor AI yang tersedia apabila anda memerlukan bantuan.

Cara Kursus Ini Berfungsi

Setiap kursus dibahagikan kepada empat pelajaran yang berfokus. Lengkapkan beberapa pelajaran sehari dan anda akan menguasai seluruh laluan dalam beberapa minggu, bukan bulan.

Cara Anda Belajar

  1. 01

    Pelajaran Interaktif

    Latihan pengekodan amali dengan maklum balas masa nyata

  2. 02

    Tutor AI

    Dapatkan bantuan segera daripada AI kami apabila anda buntu

  3. 03

    Penyunting Terbina Dalam

    Tulis dan jalankan kod terus dalam pelayar anda

  4. 04

    Sijil

    Dapatkan sijil selepas melengkapkan kursus

FAQ

Soalan Lazim

Adakah kursus Tailwind CSS Academy percuma?

Ya. Anda boleh memulakan kursus Tailwind CSS Academy secara percuma dan mengikuti pelajaran interaktifnya tanpa sebarang bayaran. Langganan PRO pilihan membuka akses kepada alat kecerdasan buatan lanjutan dan sijil yang boleh dikongsi.

Adakah saya memerlukan pengalaman terdahulu untuk mempelajari HTML?

Tidak. Kursus ini bermula dengan asas dan beralih secara beransur-ansur kepada topik yang lebih maju, jadi anda boleh bermula walaupun tanpa pengalaman terdahulu dalam HTML.

Bagaimanakah saya akan mempelajari HTML di CoddyKit?

Anda belajar melalui amali. Pelajaran interaktif yang ringkas menggabungkan penerangan yang jelas dengan latihan pengekodan praktikal yang berjalan dalam masa nyata, manakala tutor kecerdasan buatan 24/7 memberikan bantuan yang diperibadikan apabila anda menghadapi kesukaran.

Adakah saya mendapat sijil selepas menamatkan Tailwind CSS Academy?

Ya. Pelajar PRO boleh menduduki peperiksaan dan memperoleh sijil tamat kursus yang boleh dikongsi, lengkap dengan kod yang boleh disahkan untuk kursus Tailwind CSS Academy.

Bolehkah saya mempelajari HTML melalui telefon saya?

Ya. CoddyKit tersedia di web dan sebagai aplikasi asli iOS serta Android, jadi anda boleh mempelajari HTML pada mana-mana peranti dan kemajuan anda disegerakkan merentas semua peranti.

Berapakah kos CoddyKit PRO?

Kursus pertama dalam Tailwind CSS Academy adalah percuma. CoddyKit PRO membuka akses kepada setiap kursus: $5.90 seminggu, $7.90 sebulan, $29.90 setahun atau $69.99 sekali untuk akses seumur hidup tanpa pembaharuan.

Berapa lama masa yang diperlukan untuk melengkapkan Tailwind CSS Academy?

Tailwind CSS Academy mempunyai 30 kursus dan 120 pelajaran. Kebanyakan pelajaran mengambil masa kira-kira 5–10 minit, jadi keseluruhan laluan ini memerlukan sekitar 14 jam latihan amali, mengikut rentak anda sendiri.

Mulakan Tailwind CSS Academy Sekarang

Sertai ribuan pelajar yang menguasai pengaturcaraan melalui pelajaran berkuasa kecerdasan buatan.