![]() I had a great experience with it (plug and play).įirst step is to run the following schematic in your Angular project: ng add asked if you want to enable dark mode select class The easiest way to use TailwindCSS in your Angular app with version less than 11.2.0 in my personal opinion is by using the npm package. If your Angular version is greater than or equal to 11.2.0, you can skip this section Installing TailwindCSS (Angular version < 11.2.0) If you add a lot of classes to you HTML element it can get ugly, quick! A solution for this is to create components using the classes from TailwindCSS that way you clean up your HTML You won't be writing any CSS sometimes just adding classes I don't recommend it if you are new to CSS, not because is hard but because it makes you lazier.Space-y-4 it will add a vertical(Y-AXIS) space of 4 pixels between your HTML elements. The naming convention for the classes make sense.You can always inspect the TailwindCSS classes in a website and see the actual CSS code :).Well supported by different tools like Vue and React.Use it the "old school" way by applying their styles into your CSS classes.You add their classes like you would with any CSS class.You will spend more time in your business logic rather than your CSS.TailwindCSS allows you to customize their styles in a very easy way to create your own design systems. This will allow you to create and combine the classes to give your UI the aspect that you want. ![]() It comes with a set of utility classes(CSS classes). TailwindCSS is different than other CSS frameworks like Bootstrap. "A utility-first CSS framework packed with classes like flex, pt-4, text-center and rotate-90 that can be composed to build any design, directly in your markup." - Tailwind team How does TailwindCSS work?
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |