Tailwind CSS: Utility-First CSS Framework and API for Rapid, Responsive Design

Tailwind CSS Framework

I když se denně zabývám technologiemi, nemám tolik času, kolik bych chtěl, abych mohl sdílet komplexní integrace a automatizaci, kterou moje společnost implementuje pro zákazníky. Stejně tak nemám moc času na objevování. Většina technologií, o kterých píšu, jsou společnosti, které hledají Martech Zone pokrývající je, ale jednou za čas - zejména prostřednictvím Twitteru - vidím nějaké bzučení kolem nové technologie, o kterou se musím podělit.

Pokud pracujete v oblasti webdesignu, vývoje mobilních aplikací nebo dokonce nastavujete systém pro správu obsahu, pravděpodobně jste zápasili s frustrací konkurenčních stylů ve více stylech. I s úžasnými vývojovými nástroji zabudovanými v každém prohlížeči může sledování a čištění CSS vyžadovat příliš mnoho času a energie.

Rámce CSS

V posledních letech odvedli designéři docela úžasnou práci při vydávání sbírek stylů, které jsou připravené a připravené k použití. Tyto šablony stylů CSS jsou lépe známé jako CSS Framework, které se snaží vyhovět všem různým stylům a schopnostem reagovat, takže vývojáři mohou pouze odkazovat na rámec, a nikoli budovat soubor CSS od začátku. Některé populární rámce jsou:

  • Bootstrap - rámec, který se vyvíjel více než deset let, poprvé představil Twitter. Nabízí nespočet funkcí. Má své stinné stránky, které vyžadují SASS, obtížně přepracovatelné, závislé na JQquery, a je docela těžké ho načíst.
  • najít -čistý rámec, který je přátelský pro vývojáře a není závislý na JavaScriptu.
  • Nadace - obecnější a použitelnější rámec CSS, který má spoustu komponent, které lze snadno přizpůsobit. Navíc existuje Nadace pro e -mail a Motion UI pro animace.
  • Kit uživatelského rozhraní -kombinace HTML, JavaScriptu a CSS, aby se vaše klientské rozhraní vyvíjelo rychle a snadno.

Tailwind CSS Framework

Zatímco jiné rámce skvěle zvládají prvky populárního uživatelského rozhraní, Tailwind používá metodiku známou jako Atomový CSS. Stručně řečeno, Tailwind důmyslně uspořádal názvy tříd pomocí přirozeného jazyka, aby dělal, co říkají. Přestože Tailwind nemá knihovnu komponent, schopnost snadno vybudovat výkonné a citlivé rozhraní pouhým odkazováním na názvy tříd CSS je elegantní, rychlá a nesrovnatelná.

Zde je několik opravdu skvělých příkladů:

Mřížky CSS

css sloupce začáteční mřížky sloupců

Přechody CSS

přechody css

CSS pro podporu tmavého režimu

css tmavý režim

Tailwind má také fantastické k dispozici rozšíření pro VS Code, abyste mohli snadno identifikovat a vkládat třídy z editoru kódu Microsoftu.

Ještě důmyslnější je, že Tailwind automaticky odstraňuje všechny nepoužité CSS při vytváření pro produkci, což znamená, že váš konečný balíček CSS je nejmenší, jaký by mohl být. Ve skutečnosti většina projektů Tailwind dodává klientovi méně než 10 kB CSS.

Co si myslíte?

Tyto stránky používají Akismet k omezení spamu. Zjistěte, jak jsou vaše údaje komentářů zpracovávány.