---
# System prepended metadata

title: To 沛萱的小筆記

---

# To 沛萱的小筆記
## .clearfix
* https://bootstrap5.hexschool.com/docs/5.0/helpers/clearfix/
* 透過將 .clearfix 添加到父元素之中 可以輕鬆的清除 float。
![](https://i.imgur.com/k4arqof.png)
![](https://i.imgur.com/BPzmfpl.png)
> 所以這裡應該選 .nav 比較好
> 盡量不要選到boostrap裡面的為了排版存在的class。

## hover 樣式
> 在 zeplin 最上方有 按鈕、表單、選單 hover以及其他狀態時的樣式
> 如果有遇到這些元件，要到 zeplin 最上面看樣式
![](https://i.imgur.com/pxT5cvK.png)

## icon 可以用 svg 比較不會有模糊的問題
![](https://i.imgur.com/DiHgvPC.png)

## 到手機版時，尺寸問題
![](https://i.imgur.com/36kEjxY.png)
![](https://i.imgur.com/j6VDVyw.png)
> 這部分算是，同一個網站需要選一種統一，不然看不同頁，就會有點怪
> layout的margin、padding固定，內容100%撐寬(如圖一)
> 或是給一個固定(絕對)寬度(如圖二)
> 但手機版其實使用第一個排版比較好

