---
# System prepended metadata

title: "\U0001F5DE 5/26(三) 每日任務"

---

# 🗞 5/26(三) 每日任務

[codepen](https://codepen.io/wengweiling/pen/YzZVdBG)

### 第一題

知識點：
1. relative 的作用是什麼？ 加在誰身上對結果有影響嗎？
A1-1:採用相對座標的位置值。
A1-2:基準就是所加的div上面。
2. position 的作用是什麼？ 怎麼用？ 可以不加 relative 單獨使用嗎？
A2-1:可以快速配置元素的位置。
A2-2:放在想要使用定位點的div元素上。
A2-3:不行，沒有預設型的 position。
3. .translate-middle 的作用是什麼？ 加與不加差在哪？
A3-1: .translate-middle 是將 .position-relative 裡面的元素依定位點居中，會轉換translateX(-50%)和translateY(-50%)應用於元素，可以使元素絕對居中。
A3-2:目前測試沒有改變，因為預設已經居中了。


### 第二題

知識點：
1. fixed 的作用是什麼？ 跟第一題的 relative 、 position 差在哪？
A1-1:fixed 可以快速配置元素的位置。
A1-2: fixed 是固定在視窗的絕對位置，上面或下面，relative、position是依 div 元素的相對位置作為固定座標。
2. 這題為什麼不能用 relative 或 sticky ？
A2-1:因為座標的固定基準是不同的。且 sticky 在滾動的過程才會有用。

### 第三題

知識點：
1. sticky 的作用是什麼？
A1-1:將元素從一個邊緣到另一個邊緣放置在視口的頂部，但僅在滾動經過該元素之後才可以。
2. 這題為什麼不能用 relative 或 fixed ？
A2-1:因是偵測滾動的過程，再黏貼到頂部，沒有滾動過程就不會觸發。relative 或 fixed 與滾動過程無關，都不影響其定位方式。
