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

Tailwind CSS շրջանակ

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

Եթե ​​աշխատում եք վեբ դիզայնի, բջջային հավելվածների մշակման կամ նույնիսկ պարզապես բովանդակության կառավարման համակարգ ստեղծելու վրա, ապա հավանաբար պայքարել եք բազմաթիվ ոճաթերթերում մրցող ոճերի վրդովմունքների հետ: Նույնիսկ յուրաքանչյուր զննարկչի ներսում կառուցված զարգացման զարմանալի գործիքներով, CSS- ին հետևելը և մաքրելը կարող է չափազանց շատ ժամանակ և էներգիա պահանջել:

CSS շրջանակներ

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

  • Bootstrap - շրջանակ, որը ձևավորվել է մեկ տասնամյակի ընթացքում, որն առաջին անգամ ներկայացվել է Twitter- ի կողմից: Այն առաջարկում է անհամար հատկություններ: Այն ունի բացասական կողմեր, որոնք պահանջում են SASS, դժվար է ծանրաբեռնել, կախված է JQquery- ից և բավականին ծանրաբեռնված է բեռնել:
  • Բուլմա -մաքուր շրջանակ, որը հարմար է մշակողների համար և կախվածություն չունի JavaScript- ից:
  • Հիմք - ավելի ընդհանուր և օգտագործելի CSS շրջանակ, որն ունի բազմաթիվ բաղադրիչներ, որոնք հեշտությամբ կարգավորելի են: Բացի այդ, կա Էլեկտրոնային փոստի հիմնադրամ և Motion UI անիմացիաների համար:
  • UI հավաքածու -HTML- ի, JavaScript- ի և CSS- ի համադրություն `ձեր առջևի հատվածը արագ և հեշտ զարգացնելու համար:

Tailwind CSS շրջանակ

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

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

CSS ցանցեր

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

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

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

CSS Dark Mode Support- ի համար

css մութ ռեժիմ

Tailwind- ն ունի նաև ֆանտաստիկ հասանելի է երկարաձգումը VS Code- ի համար, որպեսզի հեշտությամբ կարողանաք նույնականացնել և տեղադրել դասեր Microsoft- ի կոդերի խմբագրիչից:

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

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

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