---
# System prepended metadata

title: "\U0001F3C5 Day 23 - SCSS 排序"
tags: [網頁切版直播班 - 2025 夏季]

---

# 🏅 Day 23 - SCSS 排序

使用 SCSS 時，我們通常會建立多個類型的檔案，像是全域樣式、變數、以及各頁面的樣式設定等，再建立一個 all.scss 檔案，將所有檔案匯入編譯，並且統一使用這支編譯出來的 CSS 檔案，在管理上會方便很多。
因此，正確的匯入順序就格外重要，若順序錯誤會導致樣式覆蓋問題產生。

### 題目

在 all.scss 檔中，載入的檔案順序正確是非常重要的事，請回覆下方的順序需要怎麼修改，以及原因

```sass=
@import "layout"
@import "reset"
@import "variable"
```

## 回報流程

將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔! 
解答位置請參考下圖（需打開程式碼的部分觀看）
（也可以將答案直接貼至「回報區」）

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

<!-- 解答：
```
@import "variable"
@import "reset"
@import "layout"
```  
-->


回報區
---

|  #  | Discord | CodePen / 答案 |
|:---:|:-------:|:--------------:|
|  1  |  Tetsu  |[Codepen](https://codepen.io/ttgchang/pen/RNWPELv) |
|  2  | 那個貓貓 |[Codepen](https://codepen.io/zorakao/pen/wBKaRxa) |
|  3  | Jenna |[Codepen](https://codepen.io/abiscc14/pen/ogjXJPa) |
|  4  | Chia__ |[Codepen](https://codepen.io/Chia-the-encoder/pen/ByoNvPy) |
|  5  |  Katie |[Codepen](https://codepen.io/Katiekatiehsu/pen/NPGqeoN) |
|  6  | jchunnn |[Codepen](https://codepen.io/jchunnn/pen/MYawZdE)|
|  7  |  牛奶嘎  |[Codepen](https://codepen.io/Joyce-Niu/pen/MYawLar?editors=1100) |
|  8  |  RUDY  |[Codepen](https://codepen.io/Rudy-crw/pen/ByoNMgm) |
|  9  |  小懿  |[Codepen](https://codepen.io/YT-the-vuer/pen/WbQvmPW) |
|  10 |  Jerome |[Codepen](https://codepen.io/qsc002163/pen/qEOdvzX) |
|  11 |  KlausChen |[Codepen](https://codepen.io/Klaus-Chen/pen/xbwGeqP) |
|  12 |  地瓜 |[Codepen](https://codepen.io/ChippyYU/pen/ByoNEYB) |
|  13 |  老屠 |[Codepen](https://codepen.io/fsgfxvlb-the-selector/pen/KwdpYRg) |
|  14  |  Pastor  |[Codepen](https://codepen.io/peter_hung/pen/QwjbPdw) | 
|  15  |  Nooooora  |[Codepen](https://codepen.io/Nora-Ch/pen/ogjXRBr) |
|  16  |  Kiku  |[Codepen](https://codepen.io/Kiku0110/pen/GgpJaoJ?editors=1100) |
|  17  |  社子畢卡索  |[Codepen](https://codepen.io/pen?template=RNWPmeR) | 
|  18  |  Sam.S.T.Y  |[Codepen](https://codepen.io/Sam-Yang-the-animator/pen/bNVdXgX?editors=1100) | 
|  19  |  7Lun  |[Codepen](https://codepen.io/mfyvqhsn-the-bold/pen/wBKKwOr) | 
|  20  |  平平  |[Codepen](https://codepen.io/ypinpin/pen/gbaaYZg) | 
|  21  |  登登登  |[Codepen](https://codepen.io/Duncanin/pen/jEbbNoK) | 
|  22  |  PK  |[Codepen](https://codepen.io/Percy-Ku/pen/VYvvZNe) | 
|  23  |  Elvina  |[Codepen](https://codepen.io/Elvina-the-selector/pen/XJmmWWw?editors=1100) |
|  24  |  cks40660  |[Codepen](https://codepen.io/CKS40660/pen/qEOOBOO) |
|  25  |  CBK  |[Codepen](https://codepen.io/BK-C-the-styleful/pen/gbaaObR) |
  26  |  Fan  |[Codepen](https://codepen.io/btsihioy-the-reactor/pen/NPGGWOo?editors=1000) |
|  27  |  Chris Wang  |[Codepen](https://codepen.io/Wang-Chris/pen/PwPPwzV) |
|  28  |  燕  |[Codepen](https://codepen.io/keyrtlij-the-reactor/pen/emppNWK)| 
|  29  |  Rogan  |[Codepen](https://codepen.io/RoganHsu/pen/qEOOdXw)| 
|  30  |  kashiwatei  |[Codepen](https://codepen.io/kashiwatei/pen/pvjjJEW) |
|  31  |  suemma  |[Codepen](https://codepen.io/suemma/pen/OPyyNyy) |
|  32  |  柔術小子  |[Codepen](https://codepen.io/Li-Lee-Everything-is-PM/pen/EaVVZWx) |
|  33  |  Hao  |[Codepen](https://codepen.io/Howell/pen/ZYbbLXd) |
|  34  |  An  |[Codepen](https://codepen.io/bzrpsbjq-the-encoder/pen/PwPPQWP?editors=1100) |
|  35  |  ja4071  |[Codepen](https://codepen.io/SHAO-L/pen/QwjjRpd?editors=1112)|
|  36  |  Leonard  |[Codepen](https://codepen.io/hyyfjqra-the-sans/pen/emppObb)|
|  37  |  禹成林  |[Codepen](https://codepen.io/useirin/pen/YPywGxa) |
|  38  |  NGNLzenos  |[Codepen](https://codepen.io/xmijbzdb-the-animator/pen/YPywNQW) |
|  39  |  Shawn  |[Codepen](https://codepen.io/LiShang/pen/raOxRGP) |
|  40  |  Doreen翠翠翠  |[Codepen](https://codepen.io/cuei-sian-Wang/pen/empZWLe) |
|  41  |  主委加碼啦幹  |[Codepen](https://codepen.io/popbob-the-bashful/pen/MYayGMK) |
|  42  |  Gloria  |[Codepen](https://codepen.io/ilztzykz-the-decoder/pen/ZYbWmPV?editors=1100) |
| 43 | water |[Codepen](https://codepen.io/wateruby/pen/raOLaJa)|
| 44 | B |[Codepen](https://codepen.io/Babel777/pen/zxvoEBx)|
| 45 | KOMATSU PEI |[Codepen](https://codepen.io/Komatsu2021/pen/jEbywQr?editors=0100)|
|  46  |  伊迪  |[Codepen](https://codepen.io/eku10rei/pen/pvjPxea?editors=1000) |
|  46  |  Min  |[Codepen](https://codepen.io/cvqevoxk-the-decoder/pen/vENJYNK) |
|  47  |  Midy Wu  |[Codepen]([連結](https://codepen.io/work-wu/pen/empVaQp)) |
|  48  |  Calvin  |[Codepen](https://codepen.io/CalvinChang/pen/OPyEoeM) |
|  49  | Celia |[Codepen](https://codepen.io/Cindy-Ho/pen/QwjZrrR) |
|  50  | 星雪糖 |[Codepen](https://codepen.io/vfpofbgm-the-scripter/pen/JoGQeav) |
<!-- 快速複製 -->
<!-- |  排序  |  姓名  |[Codepen](連結) | -->
