再见了!CSS!

2023-04-04 416 0

你见过没有敲一行CSS代码的前端项目吗?

还真有!

主角就是它:Tailwind CSS

官方原话:无需离开 HTML 即可快速构建现代网站

背景

Tailwind CSS是一个高度可定制的CSS框架,旨在帮助开发人员快速构建现代,响应式的Web界面。

与其他CSS框架不同,Tailwind CSS提供了一组预定义的CSS类,这些类可以直接用于HTML元素中,而无需手写CSS代码。

优点

1.可定制性强:Tailwind CSS的样式大多数都可由开发人员自行定制,因此可以很好地满足各种项目的需求。

2.减少重复代码:通过使用Tailwind CSS提供的CSS类,可以减少编写CSS代码所需的时间,并且避免了编写重复的CSS代码。

3.可读性强:通过使用语义化的CSS类名,使得HTML代码易于阅读和理解。

安装

使用npm进行安装:

npm install tailwindcss

使用yarn进行安装:

yarn add tailwindcss

使用

1.在项目中创建一个新的tailwind.css文件。
2.在该文件中编写所需的CSS类。
3.运行命令生成CSS文件,命令如下:

npx tailwindcss -i ./tailwind.css -o ./output.css

4.在HTML页面中引用生成的CSS文件。

项目地址

https://github.com/tailwindlabs/tailwindcss

相关文章

MySQL 巨坑:永远不要在 MySQL 中使用 UTF-8!
GoVirw:一款最新可视化开发平台
一款用过就离不开的文件传输软件
搞自媒体初期,不要轻易让身边人知道!
做网站,选择静态生成页,还是伪静态页面呢?
还在用 WordPress?推荐国产建站程序JPress

发布评论