Tailwind CSS

• HTML 和 CSS 的基礎知識

觀眾

• 開發人員

Tailwind CSS 是一個實用程式優先的 CSS 框架，用於快速構建自定義使用者介面。它提供了大量 CSS 類和工具，允許使用者輕鬆設置網站和應用程式的樣式。

這種以講師為主導的現場培訓（遠端或遠端）針對的是想要學習和使用Tailwind CSS來構建和設計使用者介面的開發人員。

在培訓結束時，參與者將能夠：

• 瞭解如何使用Tailwind CLI設置開發環境。
• 使用 Tailwind CSS 建立元件和編輯佈局。
• 使用 Tailwind 實用程式類設置元素樣式。
• 掌握 Tailwind CSS 基礎知識。
• 使用 Tailwind CSS 創建現代網站。

課程形式

• 互動講座和討論。
• 大量的練習和練習。
• 在現場實驗室環境中動手實施。

課程自定義選項

• 如需申請本課程的定製培訓，請聯繫我們進行安排。

介紹

• Tailwind CSS 概述

開始

• 安裝 Tailwind CSS
• 安裝節點
• 安裝 VS code
• 設置環境

Tailwind CSS 基礎知識

• 使用 HTML 附加 Tailwind CSS
• 使用實用程式類創建容器
• 添加寬度和高度屬性
• 瞭解 flexbox 的工作原理
• 包裝和調整 flex 專案的大小
• 創建網格和行佈局
• 調整網格佈局中元素的流動
• 在項目之間添加間隙並對齊專案
• 對單個項目進行對齊
• 為元素添加填充和邊距
• 使用 Tailwind 實用程式類設置文字樣式
• 添加邊框和設置邊框樣式
• 為元素添加陰影
• 使用斷點添加回應行為
• 使用偽選擇器
• 分層和應用指令
• 使用元件進行代碼重用

設置更好的開發環境

• 使用 Tailwind CLI 建立環境
• 指令和函數

摘要和後續步驟