Tailwind CSS: Frèam Utility-First CSS agus API airson Dealbhadh Gasta, Freagarrach

Frèam CSS Tailwind

Fhad ‘s a tha mi domhainn a-steach do theicneòlas bho latha gu latha, cha bhith mi a’ faighinn uiread de ùine ‘s a bu mhath leam a bhith a’ roinn na h-aonachadh iom-fhillte agus fèin-ghluasad a bhios mo chompanaidh a ’cur an gnìomh airson luchd-ceannach. A bharrachd air an sin, chan eil mòran ùine lorg agam. Is e companaidhean a tha a ’sireadh a’ mhòr-chuid den teicneòlas a bhios mi a ’sgrìobhadh mu dheidhinn Martech Zone gan còmhdach, ach a h-uile uair ann an ùine - gu sònraichte tro Twitter - tha mi a ’faicinn beagan de thoileachas timcheall air teicneòlas ùr a dh’ fheumas mi a roinn.

Ma tha thu ag obair ann an dealbhadh lìn, leasachadh app gluasadach, no eadhon dìreach air siostam riaghlaidh susbaint a stèidheachadh, tha coltas ann gu bheil thu air sabaid leis na duilgheadasan bho stoidhlichean farpaiseach thairis air iomadh duilleag stoidhle. Eadhon leis na h-innealan leasachaidh iongantach a chaidh a thogail taobh a-staigh gach brabhsair, faodaidh a bhith a ’tracadh sìos agus a’ glanadh CSS cus ùine agus lùth.

Frèamaichean CSS

Anns na bliadhnachan mu dheireadh, tha luchd-dealbhaidh air obair gu math iongantach a dhèanamh a ’leigeil a-mach cruinneachaidhean de stoidhlichean a tha deiseil agus deiseil airson an cleachdadh. Tha na Stoidhlichean CSS sin nas aithnichte mar CSS Frameworks, a ’feuchainn ri gabhail ris na diofar stoidhlichean agus comasan freagairteach gus an urrainn do luchd-leasachaidh dìreach iomradh a thoirt air frèam seach a bhith a’ togail faidhle CSS bhon fhìor thoiseach. Tha cuid de na frèaman mòr-chòrdte:

  • Bootstrap - frèam a tha air a thighinn air adhart thar deich bliadhna, air a thoirt a-steach an toiseach le Twitter. Tha e a ’tabhann feartan gun àireamh. Tha eas-bhuannachdan aige, a dh ’fheumas SASS, duilich a bhith cus, an urra ri JQquery, agus tha e gu math duilich a luchdachadh.
  • lorg - frèam glan a tha càirdeil do leasaiche agus nach eil an urra ri JavaScript.
  • Foundation - frèam CSS nas coitcheann agus nas fheumail anns a bheil tonna de phàirtean a tha furasta an gnàthachadh. A bharrachd air an sin, tha Stèidheachd airson post-d agus Gluasad UI airson beòthachaidhean.
  • Kit UI - measgachadh de HTML, JavaScript, agus CSS gus do cheann aghaidh a leasachadh gu sgiobalta agus gu furasta.

Frèam CSS Tailwind

Ged a tha frèaman eile a ’dèanamh obair mhath ann a bhith a’ gabhail ri eileamaidean eadar-aghaidh luchd-cleachdaidh, bidh Tailwind a ’cleachdadh modh-obrach ris an canar CSS Atamach. Ann an ùine ghoirid, chuir Tailwind air dòigh ainmean a ’chlas a’ cleachdadh cànan nàdarra gus na tha iad ag ràdh a bhios iad a ’dèanamh a dhèanamh. Mar sin, ged nach eil leabharlann de cho-phàirtean aig Tailwind, tha an comas eadar-aghaidh cumhachdach, freagairteach a thogail dìreach le bhith a ’toirt iomradh air ainmean clas CSS eireachdail, luath agus gun choimeas.

Seo eisimpleirean fìor mhath:

Grids CSS

colbh css tòiseachadh colbhan grids

Ìrean CSS

caiseadan css

CSS airson Taic Modh Dorcha

modh dorcha css

Tha fìor mhath aig Tailwind cuideachd leudachadh ri fhaighinn airson VS Code gus an urrainn dhut clasaichean aithneachadh bho neach-deasachaidh còd Microsoft gu furasta.

Fiù ‘s nas innleachdaiche, bidh Tailwind gu fèin-ghluasadach a’ toirt air falbh a h-uile CSS nach deach a chleachdadh nuair a bhios e a ’togail airson cinneasachadh, a tha a’ ciallachadh gur e am bundle CSS mu dheireadh agad an ìre as lugha a dh ’fhaodadh a bhith. Gu dearbh, bidh a ’mhòr-chuid de phròiseactan Tailwind a’ cur nas lugha na 10kB de CSS chun neach-dèiligidh.

Dè do bheachd?

Tha an làrach seo a 'cleachdadh Akismet gus spama a lùghdachadh. Ionnsaich mar a thathar a 'pròiseasadh an dàta bheachdan agad.