Tailwind CSS: Sürətli, Həssas Dizayn üçün Utility-First CSS Framework və API

Tailwind CSS Çərçivəsi

Gündəlik texnologiya ilə dərindən məşğul olsam da, şirkətimin müştərilər üçün tətbiq etdiyi kompleks inteqrasiyanı və avtomatlaşdırmanı bölüşmək istədiyim qədər vaxtım yoxdur. Eləcə də kəşf üçün çox vaxtım yoxdur. Haqqında yazdığım texnologiyanın çoxu axtarışda olan şirkətlərdir Martech Zone Onları əhatə edir, amma hər dəfə - xüsusən Twitter vasitəsilə - paylaşmalı olduğum yeni bir texnologiya ətrafında bəzi səs -küy görürəm.

Veb dizaynı, mobil tətbiqetmə inkişafı və ya sadəcə bir məzmun idarəetmə sistemi qurursanız, ehtimal ki, bir çox üslub cədvəlində rəqabət aparan üslubların xəyal qırıqlığı ilə mübarizə aparmısınız. Hər bir brauzerin içərisində qurulmuş inanılmaz inkişaf vasitələri ilə belə CSS -ni izləmək və təmizləmək çox vaxt və enerji tələb edə bilər.

CSS Çərçivələr

Son illərdə dizaynerlər əvvəlcədən hazırlanmış və istifadəyə hazır olan üslub kolleksiyalarını buraxmaq üçün olduqca gözəl bir iş gördülər. Bu CSS üslub cədvəlləri daha çox CSS Çərçivələri olaraq tanınır, bütün fərqli üslubları və həssas qabiliyyətləri özündə cəmləşdirməyə çalışır ki, tərtibatçılar bir CSS faylını sıfırdan qurmaq yerinə bir çərçivəyə istinad edə bilsinlər. Bəzi məşhur çərçivələr:

  • Bootstrap - ilk olaraq Twitter tərəfindən təqdim edilən, on ildən artıq bir dövrdə inkişaf etmiş bir çərçivə. Saysız -hesabsız xüsusiyyətlər təqdim edir. Sass tələb edən, overwreied çətin, JQquery -dən asılı olan mənfi cəhətləri var və yükləmək olduqca ağırdır.
  • Bulma -geliştirici dostu olan və JavaScript-dən heç bir asılılığı olmayan təmiz bir çərçivə.
  • Təməl - asanlıqla tənzimlənə bilən çoxlu komponentləri olan daha ümumi və istifadə edilə bilən bir CSS çərçivəsi. Əlavə olaraq var E -poçt üçün VəqfMotion UI animasiyalar üçün.
  • UI dəsti Ön tərəfinizi tez və asanlıqla inkişaf etdirmək üçün HTML, JavaScript və CSS birləşməsi.

Tailwind CSS Çərçivəsi

Digər çərçivələr məşhur istifadəçi interfeysi elementlərini yerləşdirmək üçün əla bir iş görsə də, Tailwind kimi tanınan bir metodologiyadan istifadə edir Atom CSS. Bir sözlə, Tailwind, dediklərini etmək üçün təbii dildən istifadə edərək sinif adlarını ustalıqla təşkil etdi. Beləliklə, Tailwind -in komponentlər kitabxanası olmasa da, yalnız CSS sinif adlarına istinad edərək güclü, həssas bir interfeys qurmaq qabiliyyəti zərif, sürətli və müqayisə olunmazdır.

Həqiqətən əla nümunələrdən bəziləri:

CSS Şəbəkələri

css sütun başlanğıc ızgaraları sütunları

CSS Gradients

css gradientləri

Qaranlıq rejim dəstəyi üçün CSS

css qaranlıq rejimi

Tailwind də bir fantastik var uzantısı mövcuddur Microsoft kod redaktorundan dərsləri asanlıqla müəyyən edə və daxil edə biləcəyiniz üçün VS Kodu üçün.

Daha da bacarıqlı olan Tailwind, istehsal üçün qurarkən istifadə edilməyən bütün CSS -ləri avtomatik olaraq silir, bu da son CSS paketinizin ola biləcəyi ən kiçik olması deməkdir. Əslində, əksər Tailwind layihələri müştəriyə 10 kB -dan az CSS göndərir.

Siz nə düşünürsünüz?

Bu sayt spam azaldılması üçün Akismet istifadə edir. Yorumunuzun necə işləndiyini öyrənin.