什麼是 box-shadow?
產生多層 CSS box-shadow,提供即時預覽、內陰影切換與精細參數控制。
box-shadow 是一個 CSS 屬性,用於在元素外部(或內部)繪製一或多個陰影。
每個陰影由水平/垂直位移、模糊半徑、可選的擴展值以及帶透明度的顏色組成;加上 inset 就會變成內陰影。
多個圖層用逗號分隔,可以疊加出層次感、發光或清晰的邊緣效果。
- 小位移 + 大模糊可形成柔和的浮起感。
- 更高不透明度 + 小模糊能得到更銳利的邊緣。
- 外陰影配合內陰影可增強立體感。
- 圖層數量盡量少,以獲得更好的效能。