Tailwind CSS: Utility-First CSS Framework iyo API ee Degdegga ah, Naqshad Kajawaabi karta

Qaab -dhismeedka CSS Tailwind

In kasta oo aan maalin kasta si qoto dheer ugu dhex jiro farsamada, ma helo waqti aad u badan sida aan jeclaan lahaa inaan la wadaago isku -dhafka adag iyo otomaatiga ee shirkadaydu u hirgeliso macaamiisha. Sidoo kale, ma haysto waqti badan oo daahfurka. Farsamada ugu badan ee aan wax ka qoro waa shirkado raadiya Martech Zone iyaga oo daboolaya, laakiin marba mar - gaar ahaan Twitter -ka - waxaan arkaa waxoogaa guux ah oo ku saabsan teknolojiyad cusub oo aan u baahanahay inaan la wadaago.

Haddii aad ka shaqeyso naqshadeynta webka, horumarinta app -ka moobaylka, ama xitaa aad sameysato nidaam maareyn nuxur ah, waxaad u badan tahay inaad la dagaallantay jahwareerka qaababka tartamaya ee ku jira xaashiyaha qaababka badan. Xitaa iyada oo leh aaladaha horumarineed ee cajiibka ah ee lagu dhex dhisay biraawsar kasta, raadraaca iyo nadiifinta CSS waxay u baahan kartaa waqti iyo tamar aad u badan.

Qaab-dhismeedka CSS

Sanadihii la soo dhaafay, naqshadeeyayaashu waxay qabteen shaqo aad u la yaab leh oo ah sii deynta aruurinta qaababka la diyaariyey oo diyaar u ah in la isticmaalo. Hababkaan CSS Stylesheets waxaa si fiican loogu yaqaan Qaab -dhismeedka CSS, iyagoo isku dayaya inay dejiyaan dhammaan qaababka kala duwan iyo kartida wax -qabadka si horumariyayaashu u tixraacaan qaab -dhismeed halkii ay ka dhisi lahaayeen faylka CSS meel xoqan. Qaababka qaarkood ee caanka ah waa:

  • Bootstrap - Qaab -dhismeed soo ifbaxay toban sano, markii ugu horreysay ay soo bandhigtay Twitter. Waxay bixisaa sifooyin aan tiro lahayn. Waxay leedahay hoos -u -dhacyo, u baahan SASS, oo ay adag tahay in laga badiyo, kuna tiirsan JQquery, waana wax aad u culus in la raro.
  • heli -qaab-dhismeed nadiif ah oo saaxiibtinimo leh oo aan ku tiirsanayn JavaScript.
  • Foundation - qaab guud oo la adeegsan karo oo CSS ah oo leh qaybo badan oo si fudud loo habeyn karo. Intaa waxaa dheer, waxaa jira Aasaaska Emailka iyo Motion UI loogu talagalay animations.
  • Qalabka UI -isku-darka HTML, JavaScript, iyo CSS si loo helo hor-u-marintaada si dhakhso leh oo fudud.

Qaab -dhismeedka CSS Tailwind

In kasta oo qaab -dhismeedyada kale ay qabanayaan shaqo aad u wanaagsan oo ay ku waafajinayaan waxyaabaha caanka ah ee adeegsadaha, Tailwind wuxuu adeegsadaa hab loo yaqaan CSS Atomic. Marka la soo koobo, Tailwind wuxuu si xariifnimo leh u abaabulay magacyada fasalka isagoo adeegsanaya luqad dabiici ah si uu u sameeyo waxay yiraahdaan inay sameeyaan. Marka, in kasta oo Tailwind uusan haysan maktabad ka kooban qaybo, kartida si fudud loo dhisi karo is -weydaarsi awood leh, wax -qabad leh oo kaliya iyadoo la tixraacayo magacyada fasalka CSS waa mid xarrago leh, dhakhso badan, oo aan la barbardhigi karin.

Waa kuwan tusaalooyin aad u wanaagsan:

Gridyada CSS

tiirka css wuxuu bilaabayaa tiirarka shabakadaha

Shahaadooyinka CSS

css gradients

CSS ee Taageerada Habka Madow

qaabka mugdiga css

Tailwind sidoo kale waxay leedahay fantastik kordhin la heli karo ee VS Code si aad si sahal ah u aqoonsato oo aad fasallada uga gasho tifaftiraha koodhka Microsoft.

Xitaa ka sii xariifsan, Tailwind wuxuu si otomaatig ah uga saaraa dhammaan CSS aan la adeegsan marka la dhisayo wax soo saarka, taas oo macnaheedu yahay xirmadaada ugu dambeysa ee CSS waa tan ugu yar ee ay suuragal tahay inay noqoto. Dhab ahaantii, badi mashaariicda Tailwind waxay macmiilka u soo diraan wax ka yar 10kB oo CSS ah.

Maxay idinla tahay?

Boggani wuxuu isticmaalaa Akismet si loo yareeyo spam. Baro sida xogtaada faallooyinkaaga looga shaqeeyo.