Tailwind CSS - 开源组件

你好，程序员们，

如果您在开发中使用Tailwind CSS，或者计划使用，不妨花几分钟时间看看这个开源库，它包含 50 多个使用Tailwind CSS样式的组件，并遵循 MIT 许可证发布。感谢您的阅读！请在评论区分享您的想法。感谢您的阅读！

• 源代码- 发布在 Github 上
• FlowBite Tailwind 组件- 免费 UI 套件
• 👉 Material Tailwind -open-source库

什么是Tailwind CSS

Tailwind CSS 与 Bootstrap、Foundation 或 Bulma 等框架不同，因为它不是 UI 工具包，也没有默认主题或内置 UI 组件。当然，如果您不介意标记中的重复，那么它在自定义方面非常强大，因为您可以创建任何您能想到的网站。

根据官方网站介绍，它是一个实用优先的 CSS 框架，用于快速构建自定义设计。Tailwind CSS 是一个高度可定制的底层 CSS 框架，它为开发人员提供了构建定制设计所需的所有构建块，并且避免了任何烦人的刻板样式。

包装内容

组件按视觉可用性标准（页脚、英雄、导航栏......）分组，并直接在Tailwind CSS （无 Javascript 依赖）之上设置样式作为pug模板，这使得它们非常容易扩展和定制。

如何使用该项目

要使用组件库，请打开终端并输入：

# Clone the repo
$ git clone https://github.com/app-generator/tailwind-css-components.git
$ cd tailwind-css-components
$
$ # Install dependencies
$ yarn
$
$ # Run dev server with live preview (Browsersync)
$ yarn start 
$
$ # Or make a production build
$ yarn build
$
$ # HTML files generated in directory public 

成分

这里有一个简短的列表，要查看完整的库，请在线访问Tailwind CSS - 组件。

• 行政
• 博客
• 电子商务
• 常见问题解答
• 画廊
• 文件夹

屏幕截图

博客文章组件

服务器错误页面

定价组件

链接和资源

• Tailwind CSS - 官方网站
• Tailwind Starter Kit - Creative-Tim制作的 TailwindCSS 精美扩展
• Tailwind CSS 组件- 源代码，已发布在 Github 上

谢谢你！