코딩공부/HTML, CSS

CSS box-shadow

dev__pixui 2020. 7. 29. 16:18

 

box-shadow 설정

 

div {
	-webkit-box-shadow: 10px 10px 24px 3px rgba(0,0,0,0.13);
    -moz-box-shadow: 10px 10px 24px 3px rgba(0,0,0,0.13);
	box-shadow: 10px 10px 24px 3px rgb(0,0,0,0.13);
}

 

 

 

box-shadow : A, B, C, D , E

 

A : horizontal length

 

B : vertical length

 

C : Blur radius

 

D : Spread radius

 

E : shadow color , Opacity

 

 

내부 그림자로 바꾸고 싶다면

속성값 맨 앞에 inset  넣어주면 끝

ex) box-shadow : inset 10px 10px 24px 3px rgab(0,0,0,0.13)

 

box-shadow 를 직접 보면서 조절하고 싶은 분들은 아래 링크 확인

 

https://www.cssmatic.com/box-shadow

 

 

끝~~