Tailwind CSS: першая ўтыліта CSS Framework і API для хуткага, спагаднага дызайну

Tailwind CSS Framework

Нягледзячы на ​​тое, што я штодня займаюся тэхнікай, я не маю столькі часу, колькі хацелася б падзяліцца складанай інтэграцыяй і аўтаматызацыяй, якую рэалізуе мая кампанія для кліентаў. У мяне таксама няма часу на адкрыццё. Большасць тэхналогій, пра якія я пішу, - гэта кампаніі, якія шукаюць Martech Zone пакрываючы іх, але час ад часу - асабліва праз Twitter - я бачу нейкі ажыятаж вакол новай тэхналогіі, якой мне трэба падзяліцца.

Калі вы працуеце ў вэб -дызайне, распрацоўцы мабільных прыкладанняў ці нават проста стварылі сістэму кіравання кантэнтам, вы, напэўна, змагаліся з расчараваннямі канкуруючых стыляў у розных табліцах стыляў. Нават з дзіўнымі інструментамі распрацоўкі, убудаванымі ў кожны браўзэр, адсочванне і ачыстка CSS можа запатрабаваць занадта шмат часу і энергіі.

Рамкі CSS

У апошнія гады дызайнеры прарабілі даволі дзіўную працу, выпусціўшы калекцыі стыляў, падрыхтаваных і гатовых да выкарыстання. Гэтыя табліцы стыляў CSS больш вядомыя як CSS Frameworks, спрабуючы змясціць усе розныя стылі і магчымасці рэагавання, так што распрацоўшчыкі могуць проста спасылацца на фреймворк, а не будаваць файл CSS з нуля. Некаторыя папулярныя рамкі:

  • Пачатковая загрузка - аснова, якая развівалася на працягу дзесяцігоддзя, упершыню прадстаўлена Twitter. Ён прапануе незлічоныя магчымасці. У яго ёсць адваротныя бакі: патрабуе SASS, які складана перазапісаць, залежыць ад JQquery, і загружаць яго даволі цяжка.
  • знайсці -чыстая база, зручная для распрацоўшчыкаў і не залежная ад JavaScript.
  • Асновы - больш агульны і зручны фреймворк CSS, які мае мноства кампанентаў, якія лёгка наладжваюцца. Акрамя таго, ёсць Фонд электроннай пошты і Motion UI для анімацыі.
  • Карыстацкі інтэрфейс Kit -спалучэнне HTML, JavaScript і CSS для хуткай і лёгкай распрацоўкі інтэрфейсу.

Tailwind CSS Framework

У той час як іншыя рамкі выдатна працуюць з размяшчэннем папулярных элементаў карыстацкага інтэрфейсу, Tailwind выкарыстоўвае методыку, вядомую як Атамная CSS. Карацей кажучы, Tailwind геніяльна арганізаваў назвы класаў, выкарыстоўваючы натуральную мову, каб рабіць тое, што яны кажуць. Такім чынам, хоць Tailwind не мае бібліятэкі кампанентаў, магчымасць лёгка стварыць магутны, спагадны інтэрфейс, проста спасылаючыся на назвы класаў CSS, элегантная, хуткая і непараўнальная.

Вось некалькі сапраўды выдатных прыкладаў:

Сеткі CSS

css слупкі пачатку сеткі слупкі

Градыенты CSS

css градыенты

CSS для падтрымкі цёмнага рэжыму

цёмны рэжым css

У Tailwind таксама ёсць фантастыка даступна пашырэнне для VS Code, каб вы маглі лёгка вызначыць і ўставіць класы з рэдактара кода Microsoft.

Што яшчэ больш геніяльна, Tailwind аўтаматычна выдаляе ўвесь нявыкарыстаны CSS пры стварэнні для вытворчасці, а гэта значыць, што ваш канчатковы набор CSS - найменшы з магчымых. На самай справе, большасць праектаў Tailwind адпраўляюць кліенту менш за 10 кБ CSS.

Што вы думаеце?

Гэты сайт выкарыстоўвае Akismet для барацьбы са спамам. Даведайцеся, як дадзеныя апрацоўваюцца каментар.