Tailwind CSS: Օգտակար-առաջին CSS շրջանակ և API արագ, արձագանքող ձևավորման համար

Tailwind CSS շրջանակ

Մինչ ես ամեն օր խորանում եմ տեխնիկայի մեջ, ես այնքան ժամանակ չեմ ստանում, որքան կցանկանայի կիսել այն բարդ ինտեգրացիաներն ու ավտոմատացումը, որոնք իմ ընկերությունն իրականացնում է հաճախորդների համար: Բացի այդ, ես շատ ժամանակ չունեմ բացահայտման համար: Տեխնոլոգիաների մեծ մասը, որոնց մասին գրում եմ, ընկերություններ են, որոնք փնտրում են Martech Zone դրանք լուսաբանելով, բայց մեկ -մեկ - հատկապես Twitter- ի միջոցով - ես տեսնում եմ ինչ -որ բզզոց նոր տեխնոլոգիայի շուրջ, որը ես պետք է կիսեմ:

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.

CSS շրջանակներ

Վերջին տարիներին դիզայներները բավականին զարմանալի աշխատանք են կատարել `թողարկելով պատրաստված և պատրաստ օգտագործման ոճերի հավաքածուներ: Այս CSS ոճաթերթերն ավելի հայտնի են որպես CSS Frameworks ՝ փորձելով տեղավորել բոլոր տարբեր ոճերն ու արձագանքող հնարավորությունները, որպեսզի մշակողները կարողանան պարզապես անդրադառնալ շրջանակին, այլ ոչ թե զրոյից կառուցել CSS ֆայլ: Որոշ հանրաճանաչ շրջանակներ են.

  • 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.
  • Բուլմա – a clean framework that’s developer-friendly and has no dependency on JavaScript.
  • Հիմք – a more generic and usable CSS framework that has tons of components that are easily customizable. Additionally, there’s Էլեկտրոնային փոստի հիմնադրամ և Motion UI անիմացիաների համար:
  • UI հավաքածու -HTML- ի, JavaScript- ի և CSS- ի համադրություն `ձեր առջևի հատվածը արագ և հեշտ զարգացնելու համար:

Tailwind CSS շրջանակ

Մինչ մյուս շրջանակները հիանալի աշխատանք են կատարում ինտերֆեյսի հանրաճանաչ տարրերը տեղավորելու համար, Tailwind- ը օգտագործում է մեթոդաբանություն, որը հայտնի է որպես Ատոմային CSS. 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.

Ահա իսկապես հիանալի օրինակներ.

CSS ցանցեր

css սյունակի մեկնարկային ցանցերի սյուներ

CSS գրադիենտներ

css գրադիենտներ

CSS Dark Mode Support- ի համար

css մութ ռեժիմ

Tailwind- ն ունի նաև ֆանտաստիկ հասանելի է երկարաձգումը for VS Code so that you can easily identify and insert classes from Microsoft’s code editor.

Առավել հնարամիտ ՝ Tailwind- ը արտադրության համար կառուցելիս ինքնաբերաբար հեռացնում է բոլոր չօգտագործված CSS- ները, ինչը նշանակում է, որ ձեր CSS- ի վերջնական փաթեթն ամենափոքրն է, որ կարող էր լինել: Իրականում, Tailwind նախագծերի մեծ մասը հաճախորդին է առաքում 10 կԲ -ից պակաս CSS:

Ինչ եք կարծում?

Այս կայքը օգտագործում է Akismet- ը սպամի նվազեցման համար: Իմացեք, թե ինչպես է ձեր տվյալները մշակվում.