Tailwind CSS: Tez, sezgir dizayn uchun birinchi CSS-ning yordamchi dasturi va API

Tailwind CSS Framework

Men har kuni texnologiyaga chuqur kirib borayotgan bo'lsam -da, men o'z kompaniyam xaridorlar uchun amalga oshiradigan murakkab integratsiyalari va avtomatizatsiyasi bilan bo'lishmoqchiman. Bundan tashqari, menda kashfiyot uchun ko'p vaqt yo'q. Men yozayotgan texnologiyalarning aksariyati - izlayotgan kompaniyalar Martech Zone ularni qamrab oladi, lekin vaqti -vaqti bilan - ayniqsa Twitter orqali - men almashishim kerak bo'lgan yangi texnologiya atrofida qandaydir shovqinni ko'raman.

Agar siz veb -dizayn, mobil ilovalarni ishlab chiqish yoki hatto kontentni boshqarish tizimini o'rnatgan bo'lsangiz, ehtimol siz bir nechta uslublar jadvalida raqobatlashayotgan uslublarning umidsizliklari bilan kurashgansiz. Hatto har bir brauzerda yaratilgan ajoyib rivojlanish vositalari bo'lsa ham, CSS -ni kuzatish va tozalash juda ko'p vaqt va kuch talab qilishi mumkin.

CSS ramkalari

So'nggi yillarda dizaynerlar tayyor va ishlatishga tayyor uslublar to'plamlarini chiqarish bo'yicha juda ajoyib ish qilishdi. Ushbu CSS uslublar varaqlari CSS Frameworks sifatida tanilgan, ular har xil uslublar va sezgir qobiliyatlarni o'z ichiga olishga harakat qilib, ishlab chiquvchilar CSS faylini noldan yaratishni emas, balki faqat ramkaga murojaat qilishlari mumkin. Ba'zi mashhur ramkalar:

  • Bootstrap - o'n yil mobaynida rivojlangan, birinchi marta Twitter tomonidan kiritilgan ramka. U son -sanoqsiz xususiyatlarni taqdim etadi. Uning salbiy tomonlari bor, SASSni talab qiladigan, ortiqcha ishlov berish qiyin, JQquery -ga bog'liq va yuklash juda og'ir.
  • topish -ishlab chiquvchilar uchun qulay bo'lgan va JavaScript-ga bog'liq bo'lmagan toza ramka.
  • Foundation - osonroq sozlanishi mumkin bo'lgan juda ko'p komponentlarga ega bo'lgan umumiy va foydalanish mumkin bo'lgan CSS tizimi. Bundan tashqari, bor Elektron pochta uchun asos va Motion UI animatsiyalar uchun.
  • UI to'plami HTML-ni, JavaScript-ni va CSS-ni birlashtirib, old panelni tez va oson ishlab chiqish.

Tailwind CSS Framework

Boshqa ramkalar mashhur foydalanuvchi interfeysi elementlarini joylashtirishda juda yaxshi ish qilsa -da, Tailwind metodologiyadan foydalanadi Atom CSS. Qisqacha aytganda, Tailwind sinf nomlarini o'zlari aytganlarini qilish uchun tabiiy til yordamida ixtiro qildi. Shunday qilib, Tailwindda komponentlar kutubxonasi bo'lmasa -da, CSS sinf nomlariga havola qilish orqali kuchli, sezgir interfeysni osongina yaratish qobiliyati nafis, tez va tengsizdir.

Mana, haqiqatan ham ajoyib misollar:

CSS tarmoqlari

css ustunining bosh panjaralari ustunlari

CSS gradientlari

css gradientlari

Qorong'i rejimni qo'llab -quvvatlash uchun CSS

CSS qorong'i rejimi

Tailwind ham ajoyib narsaga ega kengaytmasi mavjud Microsoft kod muharriridan sinflarni osongina aniqlash va qo'shish uchun VS Code uchun.

Bundan ham aqlli, Tailwind ishlab chiqarish uchun qurilayotganda ishlatilmaydigan CSS -ni avtomatik ravishda o'chirib tashlaydi, bu sizning oxirgi CSS to'plamingiz bo'lishi mumkin bo'lgan eng kichigi. Aslida, Tailwind loyihalarining aksariyati mijozga 10 kB dan kam CSS yuboradi.

Siz nima deb o'ylaysiz?

Ushbu sayt spamni kamaytirish uchun Akismet-dan foydalanadi. Fikringiz ma'lumotlarining qanday ishlashini bilib oling.