Tailwind CSS 是一個實用程式優先的 CSS 框架，其中包含可直接在標記中組合以建立任何設計的類別。

特徵：

實用至上：

Tailwind css 是一個實用程式優先的 css 框架，它提供低階實用程式類別來建立自訂設計，而無需編寫 css。這種方法允許我們實現完全自訂的元件設計，而無需編寫一行自訂 CSS。 「你不會浪費精力發明類別名稱」.

內容清除：

這是從將在生產環境中使用的最終 CSS 文件中刪除未使用的 CSS 類別的過程。這是一個優化過程，最終的 CSS 尺寸更小，更易於維護並顯示出更高的效能。

命令：

強調：

underline 
underline-offset-
decoration-- //color for underline
decoration- // size of underline
decoration-

文字樣式

text-- //color of text
text-opacity- //opacity of text
text- //size of text
text- //alignment of text

背景顏色

bg--

邊框半徑

rounded-

字體樣式

font-

斜體：

italic

能見度

隱藏元素：

hidden

顯示（與隱藏相反）：

block

填充

p-   /* All sides */
px-  /* Horizontal (left and right) */
py-  /* Vertical (top and bottom) */
pl-  /* Left */
pr-  /* Right */
pt-  /* Top */
pb-  /* Bottom */

利潤

m-   /* All sides */
mx-  /* Horizontal (left and right) */
my-  /* Vertical (top and bottom) */
ml-  /* Left */
mr-  /* Right */
mt-  /* Top */
mb-  /* Bottom */

Flexbox

flex
flex- // row or column

調整內容

justify-

對齊項目

items- //start,end,center

響應式設計

sm  /* Small devices */
md  /* Medium devices */
lg  /* Large devices */
xl  /* Extra large devices */

漿紗

h-
w-

邊框

border
border-
border-

懸停狀態

hover: