---
# System prepended metadata

title: 第 7 章 TailwindCSS教學 常用Utility篇2 - 透過實戰Pricing頁面來學習Utility！ PART 2
tags: [Tailwind CSS 開發秘技｜輕鬆打造仿 Facebook UI]

---

# 第 7 章 TailwindCSS教學 常用Utility篇2 - 透過實戰Pricing頁面來學習Utility！ PART 2
###### tags: `Tailwind CSS 開發秘技｜輕鬆打造仿 Facebook UI`

## 範例原始碼
https://github.com/scps960740/TailwindCSS_Pricing

## 下載
1. 點擊Code的綠色下拉按鈕
2. 點擊紅圈部分，即可下載壓縮檔。

![](https://i.imgur.com/MGc2eEj.png)


## 啟動範例
1. 用vscode開啟專案，然後開啟終端機，並輸入：
```
// 根據安裝package.json內的依賴列表來安裝node_modules

npm install
```

![](https://i.imgur.com/HN4pdRe.png)



2. 啟動範例
```
npm run dev
```

3. 之後在瀏覽器打開終端機裡顯示的url，即可看到畫面

![](https://i.imgur.com/vSlZJQ8.png)