Tailwind CSS: Fframwaith CSS Utility-First ac API ar gyfer Dylunio Cyflym, Ymatebol

Fframwaith CSS Tailwind

Er fy mod yn ddwfn i dechnoleg yn ddyddiol, nid wyf yn cael cymaint o amser ag yr hoffwn rannu'r integreiddiadau a'r awtomeiddio cymhleth y mae fy nghwmni'n eu rhoi ar waith ar gyfer cwsmeriaid. Yn ogystal, does gen i ddim llawer o amser darganfod. Mae'r rhan fwyaf o'r dechnoleg rydw i'n ysgrifennu amdani yn gwmnïau sy'n chwilio amdani Martech Zone yn eu gorchuddio, ond bob yn hyn a hyn - yn enwedig trwy Twitter - rwy'n gweld rhywfaint o wefr o amgylch technoleg newydd y mae angen i mi ei rhannu.

If you work in web design, mobile app development, or even just set up a content management system, you’ve probably wrestled with the frustrations of competing styles across multiple stylesheets. Even with the amazing development tools built within each browser, tracking down and cleaning up CSS can require far too much time and energy.

Fframweithiau CSS

Yn ystod y blynyddoedd diwethaf, mae dylunwyr wedi gwneud gwaith eithaf anhygoel o ryddhau casgliadau o arddulliau sydd wedi'u prepio ac yn barod i'w defnyddio. Mae'r Taflenni Steiliau CSS hyn yn fwy adnabyddus fel CSS Frameworks, gan geisio darparu ar gyfer yr holl wahanol arddulliau a galluoedd ymatebol fel y gall datblygwyr gyfeirio at fframwaith yn hytrach nag adeiladu ffeil CSS o'r dechrau. Dyma rai fframweithiau poblogaidd:

  • Bootstrap – a framework that’s evolved over a decade, first introduced by Twitter. It offers countless features. It does have downsides, requiring SASS, difficult to overwreied, dependent on JQquery, and it’s pretty hefty to load.
  • dod o hyd i – a clean framework that’s developer-friendly and has no dependency on JavaScript.
  • Sylfaen – a more generic and usable CSS framework that has tons of components that are easily customizable. Additionally, there’s Sefydliad E-bost a Cynnig UI ar gyfer animeiddiadau.
  • Kit UI - cyfuniad o HTML, JavaScript, a CSS i gael eich pen blaen i ddatblygu'n gyflym ac yn hawdd.

Fframwaith CSS Tailwind

Er bod fframweithiau eraill yn gwneud gwaith gwych o ddarparu ar gyfer elfennau rhyngwyneb defnyddiwr poblogaidd, mae Tailwind yn defnyddio methodoleg o'r enw CSS Atomig. In short, Tailwind ingeniously organized the class names using natural language to do what they say they do. So, while Tailwind doesn’t have a library of components, the ability to easily build a powerful, responsive interface just by referencing CSS class names is elegant, fast, and incomparable.

Dyma rai enghreifftiau gwirioneddol wych:

Gridiau CSS

colofnau gridiau cychwyn colofn css

Graddiannau CSS

graddiannau css

CSS ar gyfer Cymorth Modd Tywyll

modd tywyll css

Mae gan Tailwind hefyd ffantastig estyniad ar gael for VS Code so that you can easily identify and insert classes from Microsoft’s code editor.

Hyd yn oed yn fwy dyfeisgar, mae Tailwind yn cael gwared ar yr holl CSS nas defnyddiwyd yn awtomatig wrth adeiladu ar gyfer cynhyrchu, sy'n golygu mai'ch bwndel CSS terfynol yw'r lleiaf y gallai fod o bosibl. Mewn gwirionedd, mae'r rhan fwyaf o brosiectau Tailwind yn anfon llai na 10kB o CSS i'r cleient.

Beth ydych chi'n feddwl?

Mae'r wefan hon yn defnyddio Akismet i leihau sbam. Dysgwch sut mae eich data sylwadau yn cael ei brosesu.