次世代 Hugo

使用 after 動態新增內容

after 允許我們動態新增內容，也因為本質是 Element，所以可以設定各種 CSS Property。

2021-03-26

before 允許我們動態新增內容，也因為本質是 Element，所以可以設定各種 CSS Property。

2021-03-26

在右上角帶有 Badge 顯示特別資訊亦為常見 Layout，可使用 Absolute Position + Relative Position 實現。

2021-03-25

Card 常在左上角帶有 Ribbon 顯示特別資訊，可使用 Absolute Position + Relative Position 實現。

2021-03-25

由於 Relative 是相對於原 Element 空間做 Shift，因此可能與其他 Element 有 Overlap，因此必須考慮其 Overlap 優先權。

2021-03-23

Fixed 與 Absolute 都會產生新 Layer，Relative 則維持在原本 HTML 內。

2021-03-22

藉由 Absolute Position 與 top、bottom、left 、right 與 margin: auto 靈活運用，可以排出很多特殊 Layout。

2021-03-22

使用 Absolute Position 時搭配 top、bottom、left 與 right 定位時，會往父層尋找具備定位設定的父層。

2021-03-22

實務上常遇到一些不規則水平置中需求，如一個為水平置中，另一個卻水平靠右。

2021-03-22

Absolute Position 與 Fixed Position 非常類似，但還是有不少特性不太一樣。

2021-03-17