通过 Build 2 Advanced Projects 掌握 Tailwind CSS
使用基于项目的方法掌握最新的 Tailwind CSS v.3,并学习将 Figma 设计转换为 Tailwind CSS 网站
讲师:Zekaryas Yohannes
口袋资源独家Udemy付费课程,独家中英文字幕,配套资料齐全!
用不到1/10的价格,即可享受同样的高品质课程,且可以完全拥有,随时随地都可以任意观看和分享。
你将会学到的
- 自定义和配置 Tailwind CSS。
- 使用 Tailwind CSS (RWD) 进行超响应式设计。
- 为生产编写优化和高性能的代码。
- 应用深色和浅色模式。
- 管理重复并创建可重复使用的样式。
- 使用 Tailwind CSS 将 Figma 设计转换为真实网站
课程内容
5 个章节 • 23 个讲座 • 总时长 3 小时 35 分钟展开所有章节
简介和入门4 个讲座 • 18 分钟
项目 1 – 企业和目录列表网站12 个讲座 • 2 小时 7 分钟
高级顺风 CSS4 个讲座 • 42 分钟
项目 2 – 家具网站2 个讲座 • 28 分钟
结论和后续步骤1 个讲座 • 1 分钟
要求
- 基本 HTML 和 CSS
说明
Tailwind CSS是一个高度可定制的CSS 框架,可以直接在你的 HTML 中使用。不再需要繁重的 CSS。它的设计从头开始就考虑到了定制。
为什么选择顺风 CSS?
• 根据需要轻松自定义和配置。
• 创建外观独特的网站(在 Bootstrap 中并非如此)。
• 实用优先
• 更快的 CSS 样式处理
• 响应式设计。
• 轻松与任何框架一起使用。
• Tiny(生产速度超快)。
• 轻松应用深色模式和更多主题。
• 美丽的色彩预设。
• 插件。
• 定制…定制…定制。
在本课程中,我将采用基于项目的方法来教你最新的 Tailwind CSS。我们将一起建立 2 个美丽的现实世界生产就绪网站。我们将看到基础知识、一些先进的概念和技术来满足我们的需求。在这些项目中,我们不仅会看到常见的设计(如卡片、按钮、表单输入…),还会超越并介绍如何制作真正出色的设计。
必要时我会定期更新这门课程。
你会学到什么?
•自定义和配置Tailwind CSS。
• 为生产编写优化和高性能的代码。?
• 使用 Tailwind CSS ( RWD ) 进行响应式设计。
• 应用深色和浅色模式。
• 管理重复并创建可重复使用的样式。
• 不仅绑定到预定义的样式,而且你将学习如何添加和自定义你自己的预设。
•实际理解tailwind CSS和其他CSS 框架(如bootstrap)之间的区别。
2 真实项目
我们将创建 2 个真实世界的网站。这些项目是开源的并且可以免费使用。
- 尾部列表– 业务和目录列表网站
- Tail Furniture – 家具展示网站(Figma 到 Tailwind CSS)
此课程面向哪些人:
- 对于之前没有顺风 CSS 经验的任何人。
- 对于前端/后端开发人员。
- 已经了解 Tailwind CSS,但想了解更多信息并构建项目。
- 任何想要学习和使用 Tailwind CSS 的人。