Tailwind CSS: In hulpprogramma-earste CSS-ramt en API foar rap, responsyf ûntwerp

Tailwind CSS Framework

Wylst ik op deistige basis djip yn technyk bin, krij ik net sa folle tiid as ik de komplekse yntegraasjes en automatisearring diele wol dy't myn bedriuw implementeart foar klanten. Ik haw ek net in protte ûntdektiid. De measte technology wêr't ik oer skriuw, binne bedriuwen dy't sykje Martech Zone har te dekken, mar sa no en dan - foaral fia Twitter - sjoch ik wat buzz om in nije technology dy't ik moat diele.

As jo ​​wurkje yn webûntwerp, mobile app -ûntwikkeling, of sels gewoan in ynhâldbehearsysteem ynstelle, hawwe jo wierskynlik wraksele mei de frustraasjes fan konkurrearjende stilen oer meardere stylblêden. Sels mei de geweldige ûntwikkelingsynstruminten boud yn elke browser, kin CSS opspoare en skjinmeitsje te folle tiid en enerzjy fereaskje.

CSS Frameworks

Yn 'e ôfrûne jierren hawwe ûntwerpers in aardich geweldich wurk dien foar it frijlitten fan kolleksjes fan stilen dy't binne foarôf en klear foar gebrûk. Dizze CSS -stylblêden binne better bekend as CSS Frameworks, besykje alle ferskillende stilen en responsive mooglikheden op te nimmen, sadat ûntwikkelers gewoan kinne ferwize nei in kader ynstee fan it bouwen fan in CSS -bestân fanôfôf. Guon populêre kaders binne:

  • Bootstrap - in ramt dat is ûntwikkele oer in desennium, earst yntrodusearre troch Twitter. It biedt ûntelbere funksjes. It hat wol neidielen, fereasket SASS, lestich te oerskriuwen, ôfhinklik fan JQquery, en it is behoarlik heftich om te laden.
  • fine -in skjin ramt dat ûntwikkelderfreonlik is en gjin ôfhinklikens hat fan JavaScript.
  • Stichting - in mear generyk en brûkber CSS -ramt dat tonnen komponinten hat dy't maklik oanpasber binne. Derneist is d'r Stichting foar e -post en Motion UI foar animaasjes.
  • UI -kit -in kombinaasje fan HTML, JavaScript en CSS om jo front-end fluch en maklik te ûntwikkeljen.

Tailwind CSS Framework

Wylst oare kaders in geweldige taak dogge om populêre eleminten fan brûkersynterface op te nimmen, brûkt Tailwind in metodyk bekend as Atomic CSS. Koartsein, Tailwind organisearre geniaal de klasnammen mei natuerlike taal om te dwaan wat se sizze dat se dogge. Dat, hoewol Tailwind gjin bibleteek fan komponinten hat, is de mooglikheid om maklik in krêftige, responsive interface te bouwen gewoan troch te ferwizen nei CSS -klassenammen elegant, fluch en net te ferlykjen.

Hjir binne wat echt geweldige foarbylden:

CSS Grids

css kolom start grids kolommen

CSS Gradients

css hellingen

CSS foar Dark Mode Support

css tsjustere modus

Tailwind hat ek in fantastysk útwreiding beskikber foar VS -koade, sadat jo maklik klassen kinne identifisearje en ynfoegje fan Microsoft's koade -bewurker.

Noch genialer ferwideret Tailwind automatysk alle net brûkte CSS by it bouwen foar produksje, wat betsjuttet dat jo lêste CSS -bondel it lytste is dat it mooglik kin wêze. Yn feite ferstjoere de measte Tailwind -projekten minder dan 10kB CSS nei de klant.

Wat tinksto?

Dizze side brûkt Akismet om spam te ferleegjen. Learje hoe't jo kommentaargegevens ferwurke wurde.