# CSS3 (圓弧、漸層、陰影效果)


# CSS3 (圓弧、漸層、陰影效果)
###### tags: `CSS`

1. 圓弧效果 (border radius)
    > 圓形：`border radius:50%` 
    不規則形：`border radius:50px 0 0 50px` 
    [ codepen 預覽圖](https://codepen.io/michael-luo/pen/PozgbXJ)
    

2. 漸層效果 (linear-gradient)
    > `linear-gradient:(顏色,顏色)`
    > `linear-gradient:(方向,顏色,顏色)`
    > `linear-gradient:(角度(deg),顏色,顏色)`
    > [ codepen 預覽圖](https://codepen.io/michael-luo/pen/KKMYNOb?editors=1100)
    > 
3. 陰影效果 (box-shadow)
    > 基本黑底:`box-shadow:10px 10px black;`
    > 柔焦陰影：box-shadow:3px 3px 3px gray;
    [ codepen 預覽圖](https://codepen.io/michael-luo/pen/mdEgReq)