Pemasaran KandunganPemasaran E-mel & Automasi

Tailwind CSS: Rangka Kerja dan API Utiliti Pertama CSS untuk Reka Bentuk Cepat dan Responsif

Walaupun saya menceburkan diri dalam bidang teknologi setiap hari, saya tidak mendapat banyak masa kerana saya ingin berkongsi integrasi dan automasi kompleks yang dilaksanakan syarikat saya untuk pelanggan. Saya juga tidak mempunyai banyak masa penemuan. Sebilangan besar teknologi yang saya tulis adalah syarikat yang mencari Martech Zone merangkumi mereka, tetapi sekali-sekala - terutamanya melalui Twitter - saya melihat beberapa berita mengenai teknologi baru yang perlu saya kongsi.

Sekiranya anda bekerja dalam reka bentuk web, pengembangan aplikasi mudah alih, atau bahkan hanya membuat sistem pengurusan kandungan, anda mungkin bergelut dengan kekecewaan gaya bersaing di pelbagai helaian gaya. Walaupun dengan alat pengembangan luar biasa yang terdapat di dalam setiap penyemak imbas, penjejakan dan pembersihan CSS memerlukan terlalu banyak masa dan tenaga.

Rangka Kerja CSS

Dalam tahun-tahun kebelakangan ini, para pereka telah melakukan pekerjaan yang cukup menakjubkan untuk melepaskan koleksi gaya yang disiapkan dan siap digunakan. Lembaran Gaya CSS ini lebih dikenal sebagai Kerangka Kerja CSS, berusaha menampung semua gaya dan kemampuan responsif yang berbeza sehingga pembangun hanya dapat merujuk kerangka kerja dan bukannya membuat fail CSS dari awal. Beberapa kerangka kerja yang popular adalah:

  • Bootstrap - kerangka kerja yang berkembang lebih dari satu dekad, pertama kali diperkenalkan oleh Twitter. Ia menawarkan banyak ciri. Ia memang mempunyai kelemahan, memerlukan SASS, sukar untuk diatasi, bergantung pada JQquery, dan ia cukup besar untuk dimuat.
  • Bulma - rangka kerja bersih yang mesra pemaju dan tidak bergantung pada JavaScript.
  • Yayasan - rangka kerja CSS yang lebih umum dan boleh digunakan yang mempunyai banyak komponen yang mudah disesuaikan. Selain itu, ada Asas untuk E-mel and UI Pergerakan untuk animasi.
  • Kit UI - gabungan HTML, JavaScript, dan CSS untuk menjadikan front-end anda dikembangkan dengan cepat dan mudah.

Kerangka CSS Tailwind

Walaupun kerangka kerja lain berfungsi dengan baik untuk menampung elemen antara muka pengguna yang popular, Tailwind menggunakan metodologi yang dikenali sebagai CSS atom. Ringkasnya, Tailwind dengan bijak mengatur nama kelas menggunakan bahasa semula jadi untuk melakukan apa yang mereka katakan. Oleh itu, walaupun Tailwind tidak mempunyai perpustakaan komponen, kemampuan untuk membina antara muka yang responsif dan kuat hanya dengan merujuk nama kelas CSS adalah elegan, pantas, dan tiada tandingannya.

Berikut adalah beberapa contoh yang sangat hebat:

Grid CSS

lajur css lajur grid permulaan

Kecerunan CSS

kecerunan css

CSS untuk Sokongan Mod Gelap

mod gelap css

Tailwind juga mempunyai hebat sambungan tersedia untuk VS Code supaya anda dapat mengenal pasti dan memasukkan kelas dengan mudah dari editor kod Microsoft.

Lebih bijak lagi, Tailwind secara automatik membuang semua CSS yang tidak digunakan ketika membuat produksi, yang bermaksud kumpulan CSS terakhir anda adalah yang terkecil. Sebenarnya, kebanyakan projek Tailwind menghantar kurang dari 10kB CSS kepada pelanggan.

Douglas Karr

Douglas Karr ialah CMO daripada OpenINSIGHTS dan pengasas Martech Zone. Douglas telah membantu berpuluh-puluh syarikat permulaan MarTech yang berjaya, telah membantu dalam usaha wajar lebih $5 bilion dalam pemerolehan dan pelaburan Martech, dan terus membantu syarikat dalam melaksanakan dan mengautomasikan strategi jualan dan pemasaran mereka. Douglas ialah transformasi digital yang diiktiraf di peringkat antarabangsa dan pakar serta penceramah MarTech. Douglas juga merupakan pengarang buku panduan Dummie dan buku kepimpinan perniagaan yang diterbitkan.

Artikel yang berkaitan

Kembali ke atas butang
Tutup

Adblock Dikesan

Martech Zone mampu memberikan anda kandungan ini tanpa sebarang kos kerana kami mengewangkan tapak kami melalui hasil iklan, pautan ahli gabungan dan tajaan. Kami amat menghargai jika anda akan mengalih keluar penyekat iklan anda semasa anda melihat tapak kami.