|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/master-tailwind-css-with-projects/
课程评论：没有评论
**课程名称：** Master Tailwind CSS: Build 2 Advanced Projects **课程概述：** 本课程以项目为导向，教授最新的Tailwind CSS使用技巧，帮助学员构建两个精美的、适用于生产环境的真实世界网站。Tailwind CSS是一个高度可定制化的CSS框架，可以直接在HTML中使用，无需编写大量CSS代码。它从根本上就考虑到了定制性，让用户可以自由配置，轻松创建独一无二的网站，这与Bootstrap等框架有所不同。 **学习要点：** * **Tailwind CSS的定制与配置：** 深入了解如何根据个人需求定制和配置Tailwind CSS。 * **优化代码以提高性能：** 学习编写针对生产环境优化且性能卓越的代码。 * **响应式网页设计（RWD）：** 掌握使用Tailwind CSS创建响应式设计的方法。 * **暗黑模式与浅色模式的应用：** 学会如何轻松实现网站的暗黑模式和浅色模式切换。 * **管理重复性和创建可重用样式：** 学习有效管理代码重复性，并创建可重用的样式组件。 * **自定义预设样式：** 不仅限于预定义的样式，还将学习如何添加和自定义自己的样式预设。 * **Tailwind CSS与其他CSS框架的比较：** 实际理解Tailwind CSS与Bootstrap等其他CSS框架的区别。 **项目实践：** 本课程将通过以下两个真实世界的项目来巩固所学知识： 1. **Tail Listing：** 构建一个商业和目录列表网站。 2. **Tail Furniture：** 将Figma设计转化为一个家具展示网站。 这两个项目均为开源且免费使用，学员可以在实践中全面掌握Tailwind CSS的强大功能。课程会根据需要定期更新，确保内容的时效性。
Tailwind CSS is a highly customizable CSS framework which can be used directly in your HTML. No more heavy CSS. it's designed from the ground up with customization in mind.Why Tailwind CSS?• Easily customize and configure however you want to.• Create unique looking website (this is not the case in Bootstrap).• Utility First• Faster CSS Styling Process• Responsive Design.• Easily used with any frameworks.• Tiny (super fast in production).• Easily apply Dark Mode and more themes.• Beautiful Color Presets.• Plugins.• Customization...Customization...Customization.In this course I will take project based approach to teach you the latest Tailwind CSS. we will build 2 beautiful real world production ready websites together. we will see the basics, some of the advanced concepts and techniques to achieve our needs. In these project we will not only see the common designs(like cards, buttons, form inputs...) but we will go beyond and cover how you can make really great designs.I will update this course regularly when necessary.What You Will Learn?• Customize & Configure Tailwind CSS.• Write Optimized and Performant Code for Production. ?• Make responsive designs with Tailwind CSS (RWD).• Apply Dark and Light Mode.• Managing duplication and creating reusable styles.• Not only bound to the pre-defined styles but you will learn hot to add and customize your own presets.• Practically Understand the difference between tailwind CSS and other CSS frameworks like bootstrap.2 Real World ProjectsWe will create 2 real world websites. These projects are open source and free to use.Tail Listing - Business and Directory Listing WebsiteTail Furniture - Furniture Showcase Website (Figma to Tailwind CSS)
